Question

No code to this question.

请看我的jsFiddle：

http://jsfiddle.net/MrSnrub/w8rem1be/

我有两个Highstock（Highcharts）图表，每个jQuery UI选项卡上都有一个。我希望两个图表同步rangeSelectors，导航器和滚动条。换句话说，改变一个会导致另一个改变。如果是＆＃34;股票价格的导航器＆＃34;图表被移动，然后是导航器，用于＆＃34;百分比变化＆＃34;图表将相应更改，两者永远不会不同步。我该怎么做？

Answer 1

如果有人正在寻找解决方案 - 我在Highcharts论坛上回答了问题：click

快速摘要：

同步导航器和滚动条可以通过获取和设置极值来实现

ex = oldChart.xAxis[0].getExtremes();
newChart.xAxis[0].setExtremes(ex.min, ex.max, true, false);

同步rangeSelector可以通过操作按钮来实现。状态

var newRangeSelector = newChart.rangeSelector,
    newSelected = newRangeSelector.selected,
    oldSelected = oldChart.rangeSelector.selected;

if (newSelected !== null) {
    newRangeSelector.buttons[newSelected].setState(0);
}

if (oldSelected !== null) {
    newRangeSelector.buttons[oldSelected].setState(2);
    newRangeSelector.setSelected(oldSelected);
}

不需要保持隐藏的图表始终更新 - 第一个原因是更好的性能，第二个隐藏DOM元素上的项目的计算位置存在一些错误 - 因此图表应该在相关选项卡时更新已激活 - 可以通过在jquery选项卡中设置回调激活事件来实现。
```
$( "#tabs" ).tabs({
    activate: function (e, ui) { }
)};
```

完整示例：https://jsfiddle.net/w8rem1be/35/

在两个选项卡上同步两个highstock图表，相同的rangeSelector

1 个答案: