bar chart label highlight/select to synchronize between label and datapoint

2 posts, 1 answers
  1. Mingxue
    Mingxue avatar
    26 posts
    Member since:
    Apr 2016

    Posted 12 May 2016 Link to this post


    The question is similar to pie chart. Basically, I have a bar chart, and the feature I wanted is that:

    When mouse hover on bar, the according category axis label can be highlighted (customized color) too. Same goes that when mouse is over category axis label, the according bar area will be highlighted.


    Same as selection behavior, I can click on category axis label to make a selection, drag-area to do multiple selection from category axis label, same as I do this from data plot area.




  2. Answer
    Petar Marchev
    Petar Marchev avatar
    996 posts

    Posted 13 May 2016 Link to this post

    Hi Mingxue,

    The chartview does not have a 1:1 relation between a datapoint and a label in the axis. This is so because you can have multiple series which may have a datapoint for the same category. So, you can have a single label (category) on the axis, but there will be multiple datapoints for this category. This is why, you cannot achieve the desired effect via the chart's api only.

    If you need the bars of the series to have a hover interactivity, you can easily achieve this by setting the HoverMode of the chart and the LegendSettings of the bar series to DataPointLegendSettings. This will, however, not manipulate the labels of the axis.

    If you demand on having this axis-label interactivity, you need to implement it yourself. I am attaching a small project that demonstrates how to get synced bar-axislabel hover interactivity. The rest of the functionality you need you can implement in a similar manner.

    The chart does not have a drag-to-select feature at this moment. You can use the selection behavior to only click on a bar and select it. (you can use a SelectionPalette to get auto coloring). If needed, you can take a look at this sdk sample that demonstrates how you can plug in custom drag-to-select.

    Petar Marchev
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top