How to overlay a vertical marker on a line chart?

7 posts, 0 answers
  1. Jason
    Jason avatar
    7 posts
    Member since:
    Sep 2013

    Posted 19 Sep 2013 Link to this post

    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 
  2. T. Tsonev
    Admin
    T. Tsonev avatar
    2833 posts

    Posted 23 Sep 2013 Link to this post

    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!
  3. Jason
    Jason avatar
    7 posts
    Member since:
    Sep 2013

    Posted 23 Sep 2013 Link to this post

    Thanks - this is exactly what I was looking for.
  4. Jason
    Jason avatar
    7 posts
    Member since:
    Sep 2013

    Posted 24 Sep 2013 Link to this post

    BTW - where can I find documentation about categoryAxis.notes property? I cannot find it on your documentation site.

    Thanks,

    Jason
  5. Jason
    Jason avatar
    7 posts
    Member since:
    Sep 2013

    Posted 24 Sep 2013 Link to this post

    Ignore my previous email - I found the documentation.
  6. Jason
    Jason avatar
    7 posts
    Member since:
    Sep 2013

    Posted 25 Sep 2013 Link to this post

    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 
  7. T. Tsonev
    Admin
    T. Tsonev avatar
    2833 posts

    Posted 27 Sep 2013 Link to this post

    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!
Back to Top