Telerik Forums / KendoReact

Displaying significant points within a series

1 Answer 60 Views
Charts
Tony
Top achievements
Rank 1
Tony asked on 21 Nov 2022, 03:58 PM
I have a smooth series with lots of points, by default I don't want to show all markers but only a selection. For e.g. I iterate over an array to add markers but there's no way to compose this into the same series item. I've tried using a line/scatterLine with a scatter point on top but this creates two series. Is there a way to make only some markers in a series show? 

Would a hack/option be to provide some outliers

1 Answer, 1 is accepted

Sort by
0
Vessy
Telerik team
answered on 23 Nov 2022, 03:10 PM

Hi, Tony,

You can control the rendering of the markers by implementing a custom visual template, returning null for the ones that has to be missed. You can see a sample demonstrating such approach here:

Regards,
Vessy
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tony
Top achievements
Rank 1
commented on 24 Nov 2022, 11:05 AM

Thanks Vessy, is there a way to go one step further? When highlighting the series by hovering on the label I do not want to show the markers. I just want the series to appear lighter than the others like it already does. Just without the markers being visible.
Vessy
Telerik team
commented on 28 Nov 2022, 08:56 AM

Hi, Tony,

Sure, we can :) The Highlight options of the series can be controlled though the `ChartSeriesHighlight` component, where you can implement a custom highlight `Visual` template similar to the one provided in my previous reply, but only updating the color of the highlighted series (or only its alpha value):

For example, you can change the highlighting opacity like follows:

Tony
Top achievements
Rank 1
commented on 28 Nov 2022, 10:56 AM

Thanks will take a look
Vessy
Telerik team
commented on 28 Nov 2022, 01:46 PM

You are welcome, Tony, let me know if I can help you further after that.
Tony
Top achievements
Rank 1
commented on 29 Nov 2022, 11:38 AM

I'm not sure that stackBlitz is doing exactly what I want. I would like the marker to appear as normal when you hover on the series, however, when hovering on the legend item it shows all the markers on a series which I do not want. I just want the line to be prominent.
Vessy
Telerik team
commented on 01 Dec 2022, 11:32 AM

Hi, Tony,

Thank you for the provided additional information. In such case, you will need to call the same logic inside the `ChartSeriesHighlight.visual` and the `ChartSeriesMarkers.visual`, so the hidden markers will remain invisible when the legend item is hovered.

Please, examine the following sample and let me know whether this is the result that you are after:

Tags
Charts
Asked by
Tony
Top achievements
Rank 1
Answers by
Vessy
Telerik team
Share this question
or