KendoUI折线图 - 动态Y轴

Does anyone know if it is possible to make the y-axis of a KendoUI Chart dynamic? Ultimately what I would like to do is have the mouse wheel either increase or decrease the range when scrolled on top of it. Another (less elegant) way would just to have two buttons + and - to increase the range on the y-axis. Any guidance would be greatly appreciated. I haven't been able to find anything through the documentation.

有谁知道是否有可能使KendoUI图表的y轴动态化?最终我想要做的是让鼠标滚轮在其上滚动时增大或减小范围。另一种(不那么优雅)的方式就是有两个按钮+和 - 来增加y轴的范围。任何指导将不胜感激。我无法通过文档找到任何内容。

1 个解决方案

#1

You can use the chart.setOptions to change the valueAxis min and max properties with something like

您可以使用chart.setOptions更改valueAxis min和max属性

var chart = $("#chart").data("kendoChart");
var min = chart.options.valueAxis.min;
var max = chart.options.valueAxis.max;
chart.setOptions({ valueAxis: { min: min * 1.25, max: max * 0.75 }});

Which you can call with a button click etc. Using this * answer (https://*.com/a/22518932/1293912) I used a jquery handler on the window to catch the events mousewheel, and DOMMouseScroll and used those event handlers to call the increase/decrease Y Axis

您可以通过单击按钮等来调用。使用此*应答(https://*.com/a/22518932/1293912)我在窗口上使用了一个jquery处理程序来捕获事件mousewheel,以及DOMMouseScroll并使用这些事件处理程序调用增加/减少Y轴

Here is a quick and dirty sample http://jsbin.com/dateka/1/edit?html,js,output

这是一个快速而肮脏的示例http://jsbin.com/dateka/1/edit?html,js,output

#1