自定义缩放到Google折线图

Question

我正在使用dragToZoom资源管理器功能为我的折线图添加缩放功能。

explorer: { 
    actions: ['dragToZoom', 'rightClickToReset'],
    axis: 'horizontal',
    keepInBounds: true,
    maxZoomIn: 4.0
}

小提琴示例here。

我还想添加一个自定义缩放，用户可以选择一个开始日期，图表会缩放到句号[开始日期;当前的日期]。

我看到Annotation Charts提供了一个名为setVisibleChartRange(start, end)的方法，可以做到这一点。但是，我在我的应用程序上尝试了它们，它们不像Line Charts那样令人愉悦和可自定义（传说，边框等）。

有没有办法改变折线图上的可见范围？

Answer 1

不使用注释图表的最佳方法是按照WhiteHat的注释提示，添加CharRangeFilter并更改其状态。

正如Google Developers page中所述，更改状态后需要调用draw()方法：

  

经验法则是直接在特定ControlWrapper（或ChartWrapper）实例上执行您需要的任何更改：例如，通过setOption()和{更改控件选项或状态分别为{1}}，然后调用其setState()方法。

draw()

我在JSFiddle上创建了一个工作示例。