我使用ZingChart库创建了一个Graph ,一切都按预期工作.该图用于显示特定插座随时间的功耗.
加载图表后,系统会显示该时间段的kWh消耗量.
用户可以放大和缩小图形,当发生这种情况时,我想显示图表中显示的那段时间的功耗.
我正在使用缩放事件:
zingchart.render({ id:'chartDiv', data:graphset, height:500, events:{ zoom:function(p){ console.log(p); console.log(zingchart.exec(p.id, 'getseriesdata', {})); console.log(zingchart.exec(p.id, 'getseriesvalues', {})); console.log(zingchart.exec(p.id, "getplotvalues", {})); } }, width:"100%" });
当我放大或缩小时,函数getseriesdata,getseriesvalues和getplotvalues总是返回完整的图形值,而不仅仅是可见的值.
p对象给出了新的x和y限制,但我找不到使用它们来获取可见值的方法.
有没有人这样做过?
很感谢任何形式的帮助.
谢谢!
该zoom
事件返回scaleX min和max(as kmin
和kmax
)以及系列min和max(as xmin
和xmax
).
使用xmin
和xmax
,您可以简单地对values数组进行切片以获取可见值.
这是一个例子.
zingchart.bind('myChart', 'zoom', function(p) { var start = p.xmin; var end = p.xmax + 1; var series = zingchart.exec('myChart', 'getseriesvalues')[0]; series = series.slice(start, end+1); // You can now do whatever you want with the series values });
您可以在此处查看工作演示.
完全披露:我在ZingChart团队.如果这解决了您的问题,请告诉我.