ExtJS 6以编程方式重置图表缩放

时间:2017-09-05 11:39:21

标签: extjs extjs6

如何以编程方式重置简单折线图的缩放(显示整个图形)?我无法在文档中找到合适的方法。

如果它是metter,我会使用Ext.chart.interactions.CrossZoom

1 个答案:

答案 0 :(得分:1)

CrossZoom class中有一个未记录的include方法。 您可以像这样使用它:

undoZoom

修改

交叉缩放交互使历史记录放大chart.getInteraction('crosszoom').undoZoom(); 属性。 zoomHistory方法沿缩放历史记录返回,一次一步/缩放。

基于undoZoom方法,我创建了一种undoZoom方法,可直接将图表重置为初始缩放:

resetZoom

这是一个工作小提琴:https://fiddle.sencha.com/#view/editor&fiddle/264t

另一个编辑

正如@SergeyNovikov已在评论中注明,正如您从Ext.define(null, { override: 'Ext.chart.interactions.CrossZoom', resetZoom: function () { var zoomMap = this.zoomHistory[0], axes = this.getChart().getAxes(); if (zoomMap) { for (var i = 0; i < axes.length; i++) { var axis = axes[i]; if (zoomMap[axis.getId()]) { axis.setVisibleRange(zoomMap[axis.getId()]); } } } this.getUndoButton().setDisabled(true); this.zoomHistory = []; this.sync(); } }); 方法和undoZoom覆盖中所看到的,这一切都归结为轴&#39; setVisibleRange方法。因此,您也可以直接使用最小/最大值作为参数来重置缩放。