By default, the tooltip appears as soon as the cursor enters the chart. I would like to control when it first appears in one of two ways:
Wait for user to hover over (around) a data point on the chart.
This way the user can look at the entire chart without the
distraction of the tooltip.
mousedown - is there a way to disable the default mousedown function
and use it for displaying the tooltip instead? And because the
tooltip and crosshair seem to be joined, perhaps the same mousedown
event could fire the crosshair to appear?
number 2 would be best; any suggestions/solutions would be appreciated!
Number 2 is possible to achieve by:
disable default Highcharts tooltip
create point.click event handler
in above handler, create your own tooltip (it's simple div with some CSS)
make proper position for tooltip (accessed via this.point.plotX and this.point.plotY
Related
I am using the "Custom Events" highchart plugin by Black Label, to detect right click in my chart. My goal is to use the right click in the chart as "Back" button when drilling out from my custom data. I know highchart has drilling options embedded, but this is a highly custom application, and my problem is that I need a way to detect right click on the x-axis crosshair line.Since the crosshair is following the mouse, 90% percent of the right clicks is triggered on the crosshair line itself, and I can not manage to detect that click. I need the event to be catched inside highcharts, because there is multiple charts on my page, and I need to know which chart was clicked on, and on what point.
I hope you understand my explanation and problem.
BR,
Benjamin Kruger
I am a customized tooltip.
But now, when you change the filter range desynchronizes tooltip with the block.
Somebody sees the cause of the bug ?
`http://jsfiddle.net/gsv48wqg/`
I am noticing something strange; I have a click event on a chart, and the chart fire up the event no problem.
Then I add a link in the tooltip, but when I click on it; the chart event fire, not the one that should open the link.
It works only if the tooltip will render on an area that is not part of the plot area (say, a value is high enough to render a tooltip on the title bar; if I click on that link, it will work).
I suspect that there is some sort of parameter that tell highcharts if the link in the tooltip is above the chart plot area? Otherwise it is impossible to have the tooltip open a link, if the highcharts click event is enabled.
You need to set useHTML flag as true.
Code: http://jsfiddle.net/sbochan/voh6ebt8/
Example: http://jsfiddle.net/sbochan/voh6ebt8/show
I have a charts done in highcharts in which I show and hide series depending on a checkbox (if the user clicks on a checkbox and all series are shown, if he unchecks the checkbox, some series are hidden).
It is working great.
Now I have an issue with the legends in the chart: if the series are hidden and the users enables a legend, the segment of all series (hidden or not) are shown in the chart.
I would like to handle the click item so I only handle series that are being shown.
To do that, I created an eventhandler for the legendItemClick event.
Inside it, I am able to access the legend (using this) but I am only able to call functions in a legend level, affecting all series. Is there anyway I could get to a series level?
Thanks!
Edit: created a jsfiddle as an example: http://jsfiddle.net/JLkGm/1/
Steps to reproduce:
1- unmark the checkbox
2- click twice in john + joe
Note that the segment related to Jane + Janet will show up
I would like to prevent this segment from showing if the checkbox is not checked.
ps: sorry for the js code in the checkbox event handler, we are using coffeescript, the original code was this one
toggleCompareData: (toggle) ->
columnName = COLUMN_HIGHCHARTS_TOKEN + #secondaryPrefix
if toggle
for serie in #chart.series
serie.show() if serie.stackKey is columnName
else
for serie in #chart.series
serie.hide() if serie.stackKey is columnName
It looks like bug, reported to our developers here: https://github.com/highslide-software/highcharts.com/issues/3309
Basically I want to do simple thing - save to user cookie chart xAxis.min and xAsis.max when user uses the Navigator, so that next time I could show him chart on the same selected period.
Is there some kind of onChange event or I have to read chart's parameters in setInterval?
You can use the xAxis.events.afterSetExtremes (API) or xAxis.events.setExtremes event. From your requirements I would assume that afterSetExtremes is sufficient.
If you want to only capture changes through the navigator you need to check
if(event.trigger == 'navigator'), otherwise you can just look at general changes.
Here is a JFiddle Highstock demo that shows the use of setExtremes event and what event.trigger values you can get.