gpt4 book ai didi

reactjs - 在 ESNet React-timeseries-charts 图表上启用缩放

转载 作者:行者123 更新时间:2023-12-03 14:12:35 24 4
gpt4 key购买 nike

我目前正在玩 ESnet's react timeseries charting components ,其具体目标是允许用户放大显示的图表,如 currency example 所示。 .

根据their documentation据我对示例源代码的最佳理解,如果呈现如下所示的图表,应该就足够了:

<ChartContainer timeRange={series.range()}>
...
</ChartContainer>

enablePanZoom={true} 添加到 props 以启用缩放。例如:

<ChartContainer timeRange={series.range()} enablePanZoom={true}>
...
</ChartContainer>

但是,这不起作用,我不明白为什么。我想文档或示例中的某些内容让我困惑:

  • 在本地运行可缩放示例可以按预期工作
  • 在启用缩放标志的情况下运行不可缩放示例不起作用

因此,问题是:如何使react-timeseries-charts图表可缩放?

编辑:结果答案很明显:必须使用onTimeRangeChanged并更新状态,否则,嗯,噗。 ..

最佳答案

在他们的例子中,他们使用onTimeRangeChanged={this.handleTimeRangeChange}

如果您查看示例源代码,则位于 https://github.com/esnet/react-timeseries-charts/blob/master/src/website/packages/charts/examples/currency/Index.js

他们将函数定义为

handleTimeRangeChange = timerange => {
this.setState({ timerange });
};

你尝试过吗?

关于reactjs - 在 ESNet React-timeseries-charts 图表上启用缩放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51839485/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com