I have a zoomable Kendo React Chart where I have set a maximum on the . If the user zooms in and zooms out that max is lost.
In my particular use case, I have 2 series each with their own . The second series should really always be shown on a scale from 0-3. To do this I have set a max on the second Y axis to 3 but this is lost as soon as the user zooms.
I do want the user to be able to zoom but when they zoom back out I expect the user to be able to return the chart to its initial state of having a max of 3 on the .
This show this behavior: https://stackblitz.com/edit/react-l5udtx
Is there a recommended way to achieve this?
1 Answer, 1 is accepted
0
Hello, Erik,
This occurs as the max value is set only initially. Then when the user zooms in or out the new max is set based on the actual visible values of the Chart. The Chart changes this value internally in order to achieve the zoom functionality:
https://www.telerik.com/kendo-react-ui/components/charts/api/ChartProps/#toc-onzoom
https://www.telerik.com/kendo-react-ui/components/charts/api/ChartProps/#toc-onzoomend
A possible approach is to use the zoom event and the zoomEnd events based on which to programmatically set the max to 3, when the user zooms out to a certain level:
https://stackblitz.com/edit/react-l5udtx-crsu7y?file=app%2Fmain.js
Regards,
Stefan
Progress Telerik
This occurs as the max value is set only initially. Then when the user zooms in or out the new max is set based on the actual visible values of the Chart. The Chart changes this value internally in order to achieve the zoom functionality:
https://www.telerik.com/kendo-react-ui/components/charts/api/ChartProps/#toc-onzoom
https://www.telerik.com/kendo-react-ui/components/charts/api/ChartProps/#toc-onzoomend
A possible approach is to use the zoom event and the zoomEnd events based on which to programmatically set the max to 3, when the user zooms out to a certain level:
https://stackblitz.com/edit/react-l5udtx-crsu7y?file=app%2Fmain.js
Regards,
Stefan
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items