如何重置React-plotly.js创建的contour类型图表的默认缩放/比例

错误原因 #

你遇到的报错是因为scene是3D图表（如你用到的mesh3d）的专属布局属性，2D的contour等高线图不存在该属性，调用scene.xaxis.autorange相当于访问未定义对象下的属性，因此触发了_inputDomain相关的类型错误。

解决步骤 #

1. 先给React-Plotly组件添加layoutRevision固定属性，避免组件默认用props内的layout配置覆盖你手动修改的布局：

<Plot
  data={surfacesData}
  layout={layout}
  divId="surfaces_container"
  config={{ displayModeBar: false }}
  layoutRevision="fixed" 
/>

2. 调用Plotly.relayout时直接使用根层级的xaxis、yaxis配置，不需要加scene前缀，同时先清空之前手动设置的range值再开启autorange，保证缩放重置生效：

Plotly.relayout("surfaces_container", {
  "xaxis.range": null,
  "yaxis.range": null,
  "xaxis.autorange": true,
  "yaxis.autorange": true
});

内容的提问来源于stack exchange，提问作者AHLC