缩放时高图显示滚动条

时间:2019-09-18 19:36:43

标签: javascript highcharts react-highcharts

在Highcharts图表中使用zoomType为'x'进行缩放似乎只能裁剪给定坐标停靠点之间的数据区域。有没有办法放大并通过滚动仍然提供所有数据?

{
  chart: {
    borderWidth: 0,
    zoomType: "x",
    scrollablePlotArea: {
      scrollPositionX: 1,
      minWidth: 1057
    }
  }
}

Command line extension management

上面的小提琴设置为最小宽度1057px,而容器的最大宽度为800px。这将强制使用水平滚动条。如果放大数据,请注意可用的滚动区域不会改变。这意味着数据不会缩放,而是被裁剪和拉伸以填充该区域。

我知道有些事件可以挂接到-重绘事件似乎是可能的候选者。也许我可以调整minWidth并取消裁切缩放,或者是否有缺少的配置,谁可以做我想做的事?

1 个答案:

答案 0 :(得分:1)

最简单的解决方案是使用Highstock的scrollbar功能:

scrollbar: {
    enabled: true
}

实时演示: https://jsfiddle.net/BlackLabel/be5wvg9q/

API参考: https://api.highcharts.com/highstock/scrollbar