StackLabels are displayed over tooltip, when useHTML is set to true in stackLabels.
This looks quite odd.
I tried adjusting z-index of .highcharts-stack-labels and .highcharts-tooltip, but no luck.
P.S - I tried the solution here, but that didn't work for me.
Fiddle : https://jsfiddle.net/nrcuks2a/
The below option solved the problem
tooltip: {
outside: true
}
see here
updated fiddle : https://jsfiddle.net/nrcuks2a/2/
Related
I want hide tooltip and crosshair when screen resize but when I call method
this.chart.tooltip.hide();
Only tooltip hide , I dont see any method help hide crosshair.
After some fiddling around I found out that this works (for a button):
$('button').click(function() {
chart.update({tooltip: {enabled: false}, xAxis: {crosshair: false}}, true);
})
This disables the tooltip, and at the same time disables crosshair.
Note that setting tooltip: {crosshairs: false} in the update function will not do anything. Ref: tooltip.crosshairs.
crosshairs: Mixed
Since 4.1, the crosshair definitions are moved to the Axis object in order for a better separation from the tooltip. See xAxis.crosshair.
Working example: http://jsfiddle.net/q04df7wy/12/
Does anyone know how to hide 'zoom' text on highstock's rangeSelector?
I already looked up the API page, but could't find the solution.
Thanks in advance!
You can use lang options and set empty string.
Highcharts.setOptions({
lang:{
rangeSelectorZoom: ''
}
});
http://jsfiddle.net/q0ra5tk6/
The rangeSelectorZoom property as suggested by Sebastian is not present in 6.1.0 anymore. A work around if you don't need the From and To Inputs, as it was my case is to not show the label at all:
rangeSelector: {
labelStyle: {
display: 'none'
}
}
Highcharts paints the chart as the page loads. For example when a simple bar chart is loaded, columns are painted on progressively.
Is there a way to disable this? I just want to chart as it is. No movements. I tried to set animation to false. But it does not work.
Jake He
The initial animation is hidden under a different "animation" option:
plotOptions: {
series: {
animation: false
}
},
Here's a JSFiddle using that option: http://jsfiddle.net/troygizzi/3w7noceq/
It was based on this one: http://jsfiddle.net/highcharts/VqruM/
I've got a HighChart bar chart with a whole ton of options, and it works perfectly except for one minor issue. According to all the documentation I've found, if I have a plotOptions of :
{
cursor: "pointer",
column:{
dataLabels: {
color: "#4572A7",
enabled: true,
style: {"fontWeight":"bold"}
},
inside: false,
point:{"events":{}},
stacking: 'normal',
}
}
I should get a caption above each bar in my bar chart. However, instead of appearing above each bar, these captions are being rendered in the center of the bar. I'm sure I'm just missing one key option or something, but I haven't been able to figure out what that option is ... do any HighCharts experts out there happen to know?
It turned out that the option I was missing was verticalAlign; when I added that to my dataLabels options (with a value of "top") it fixed things ... well mostly. I also had to add a y option of "-10" to actually get the labels to be above the bar.
The funny thing is, I have the code for an old version of the chart, and it didn't have a verticalAlign option at all, but it showed its labels above the bar. I guess some other option that I'm using in my version made the verticalAlign necessary.
In any case, I'm leaving this self-conversation behind in case someone else runs in to this same problem.
I'm developing a chart that have 2 splines and 2 scatter. I use the default tooltip formatter to exhib a tooltip based in the spline data. But when I hover a scatter despite I hide the default tooltip, before show the scatter one, it appears to have triggered again.
How can I prevent the default tooltip to be triggered?
ps: im using Highcharts 3.0.1
EDITED: I tried "chartObj.tooltip.enabled = false" but it didn't work.
If you don't want to show the tooltip for a particular serie in the chart, see if setting
enableMouseTracking: false
on you desired serie's properties does it.
Hope this help.
I solved using this code:
chartObj.tooltip.options.enabled = false;
Setting to "false" when I hover and to "true" on mouseout.