javascript - React 的 Plotly.js uirevision 不起作用

Question

Plotly 可以选择通过拖动框来放大图表。

每次重新渲染 react 组件时，都会初始化 Persist 用户更改。

在 Plotly 选项中，有关于它的选项。“在 Plotly.react 在 JavaScript 中的 uirevision”

我已经应用了它，但没有任何变化。

这是我的代码

const GraphContainer = styled(Plot)`
  width: 100%;
  height: 300px;
`;

.....

return (
  <>
    <GraphContainer
      data={[
        {
          x: graphData.power.x,
          y: graphData.power.y,
          name: 'Graph',
          line: {
            color: theme.colors.chart.single[1],
          },
        },
      ]}
      layout={{
        xaxis: {
          type: 'date',
          range: [
            '2021-10-21 00:00:00',
            '2021-10-21 23:59:00',
          ],
        },
        yaxis: {
          tickformat: ',.0f',
          ticksuffix: 'kW',
        },
        uirevision: 'true',
      }}
      config={{ responsive: true, displayModeBar: false }}
    />
  </>
);

我做的另一件事：

在 Link 中，有解释“用户交互会改变布局并将 autorange 设置为 false，因此我们需要将其重置为 true”。根据文档，我已将布局对象设置为状态，uirevision：'true'，yaxis 和 xaxis 的自动范围设置为 true，但不起作用。

请有人帮助我。谢谢你。

标签： javascriptreactjstypescriptplotlyplotly.js