This is a migrated thread and some comments may be shown as answers.

How to overlay a vertical marker on a line chart?

6 Answers 330 Views
Charts
This is a migrated thread and some comments may be shown as answers.
Jason
Top achievements
Rank 1
Jason asked on 19 Sep 2013, 12:44 PM
Hi  I am a newbie to Kendo Dataviz so apologize if this is something that has been answered before. Basically I am constructing a line chart using a time based series and the data is dynamically updated so the axis/values are been updated over time and the graph is refreshed every few seconds. I need to mark certain events at some point of time on the same graph so users can see how these events are correlated to the values been displayed. Ideally these events should be marked as a vertical line overlaid on the graph so the event time and its correlation to the chart data points can be clearly seen. 

I have not been able to find a way to do this with Kendo Dataviz. Is there a feature that will allow me to do this or is there a way that I can use to directly access the graph canvas and do some direct drawing?


Thanks and appreciate your help,

Jason 

6 Answers, 1 is accepted

Sort by
0
T. Tsonev
Telerik team
answered on 23 Sep 2013, 11:45 AM
Hi,

The chart allows you to set annotations (known as "notes" in the API) on both series points and on date axes.

I've prepared a short standalone demo for initializing and updating the notes here:
http://jsbin.com/obuweca/3/edit

I hope this helps.

Regards,
T. Tsonev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jason
Top achievements
Rank 1
answered on 24 Sep 2013, 01:21 AM
Thanks - this is exactly what I was looking for.
0
Jason
Top achievements
Rank 1
answered on 25 Sep 2013, 12:02 AM
BTW - where can I find documentation about categoryAxis.notes property? I cannot find it on your documentation site.

Thanks,

Jason
0
Jason
Top achievements
Rank 1
answered on 25 Sep 2013, 12:03 AM
Ignore my previous email - I found the documentation.
0
Jason
Top achievements
Rank 1
answered on 25 Sep 2013, 06:58 PM
A couple of notes more related questions
1. Can an event callback being configured if a user click on a note (one the note label or the line itself)? I guess you can use a plot area click event handler then compare the click coordinates with the notes position but I am wondering if there is an easier way to do this. 
2. The notes.line.length property - in what unit it is in, pixels? 

Thanks,

Jason 
0
T. Tsonev
Telerik team
answered on 27 Sep 2013, 10:56 AM
Hi,

There isn't a suitable event for handling note clicks. We'll add a "noteClick" event in our to-do list for the next release.
The line length is expressed in pixels. We'll update the docs to reflect this.

Regards,
T. Tsonev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Charts
Asked by
Jason
Top achievements
Rank 1
Answers by
T. Tsonev
Telerik team
Jason
Top achievements
Rank 1
Share this question
or