如何使用高图表反应将默认缩放设置为 6 个月?

Question

我有几个highcharts-react图表，其中默认缩放级别应为 6 个月(对于 x 轴(。有一个使用默认 Highcharts 库的解决方案，但我不明白如何使用 React 来做到这一点。

这就是我走多远：

// …
import Highcharts from "highcharts/highstock";
import HighchartsReact from "highcharts-react-official";
import more from "highcharts/highcharts-more";
// …
if (typeof Highcharts === "object") {
more(Highcharts);
}
// …
<HighchartsReact
highcharts={Highcharts}
constructorType={"stockChart"}
options={{
credits: {
enabled: false
},
xAxis: {
events: {
setExtremes: () => {
// Is this right? What should be in this function?
}
}
},
series: [
{
type: "candlestick",
name: props.timeSeries.name,
data: openHighLowClose
}
]
}}
/>

Answer 1

我看到您正在创建一个股票图表，因此在这种情况下，您可以使用范围选择器功能设置显示范围。

下面是一个演示，我将所选按钮设置为 2，默认情况下等于 6 个月。您可以在我上面发布的 API 中找到更多信息。

演示：https://codesandbox.io/s/highcharts-react-demo-yjtgj