Kendo Chart Marker on Hover

4 posts, 0 answers
  1. shaneed
    shaneed avatar
    21 posts
    Member since:
    Jun 2013

    Posted 02 Feb Link to this post

    We have a multi plot line chart where we have default circle markers with white background, which works fine. But when 2 plots intersect at a point hovering to find the correct tooltip is a problem.So we can with the design to stop showing the marker circles and a show a horizontal dotted line moving with the mouse. When we come upon a category axis label 3 bubbles/dots corresponding to the three plots should appear on it, not on the series plot itself (as 2 plots are coinciding). They should appear at fixed height intervals and on hover should how a bubble glow effect and the corresponding tooltip should come. Now can this be done.

    As far I have seen through kendo only markers on plots can be zoomed or changed on hover (no effects), also they will stay on the plot line (meaning in our case 2 markers will coincide). Also is there a vertical hover line.

    I am attaching an image made in another tool for reference.

  2. Daniel
    Admin
    Daniel avatar
    2133 posts

    Posted 06 Feb Link to this post

    Hello,

    I am not sure if I correctly understand the requirement but you can use crosshair for the categoryAxis to show the line. To show a tooltip no matter if the points have the same position, I can suggest to use a shared tooltip. The configuration is demonstrated in this demo. 

    Regards,
    Daniel
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. shaneed
    shaneed avatar
    21 posts
    Member since:
    Jun 2013

    Posted 10 Feb Link to this post

    Hi Daniel,

    Yes crosshair was what exactly I wanted, but instead of shared tool tip is it possible to show the bubbles on the crosshair line but not exactly on the series line itself, a little above them so that when the user hovers over them it can show an animation effect an the tool tip. As I said in the original post if 2 plots intersect at one point (each plot having its own value axis) it is difficult for the user to pop exactly the tooltip of the plot he wants to observe. Lets say series 1 and series 2 coincide graphically for their values ("1 Feb", 1.9) and ("1 Feb", 5.3) now which one tool tip will it actually show is difficult. Having shared tooltip is useful here but for mobile platforms it becomes a bit big and space consuming.

    Also is it possible to show an animation effect on hovering a marker.

  4. Daniel
    Admin
    Daniel avatar
    2133 posts

    Posted 14 Feb Link to this post

    Hello,

    The described functionality is not supported. Something similar can be achieved by using custom visual and the drawing API - example. However, based on the description and the image I am not sure if I understand how should the markers position be determined. Could you clarify?

    Regards,
    Daniel
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top