I have some annotations in my chart and I would like to get the specific day of my xAxis datetime when I click on one of those.
Related
I have a Vaadin chart like this:
.
My goal is to get the hovered X value when clicking on the chart. Based on the previous image, I would like to get what month area is being clicked (the selected area is blue coloured in the image).
I've added a PointClickListener to that chart and inside that event I can get the needed information, but I have to click exactly hover the point. Clicking in the month area is not fired the PointClickListener:
chart.addPointClickListener(
pointClickEvent -> {
//Here I get the selected month:
int monthIndex = event.getPointIndex();
So I would like to know if there's any method to obtain the hovered month by only clicking in that area, not exactly above the point.
You could use Chart click event, and you will get the coordinates of the click, the event has info of the coordinates, for your purpose you could use the xAxisValue to know which point is in the clicked zone.
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.
How do I create a simple chart with a single horizontal bar. Xaxis is time and yaxis is one category named execution. I want to show a chart that shows a bar during the times when I have state executing and for states in between I want to display a blank in the same horizontal bar.
What you are looking for, I think, is a Gantt chart. Check out this example: http://jsfiddle.net/highcharts/KNGba/. It is a basic chart with just one element. Now check out this one: http://jsfiddle.net/highcharts/r6emu/. This shows you events during a time line.