Question

我正在使用plotly.js创建一个包含标记和线条的图形。我想禁用线条的悬停和尖峰功能（辅助线），而不是标记。

我需要在同一轴上显示两个图，如以下示例所示：

var traces = [];
traces.push({
  type: 'scatter3d',
  mode: 'markers',
  x: [0, 1],
  y: [0, 1],
  z: [0, 1],
});

traces.push({
  type: 'scatter3d',
  mode: 'lines',
  hoverinfo: 'none',
  x: [1, 0],
  y: [0, 1],
  z: [0, 1]
});
Plotly.newPlot('myDiv', traces, []);

<html>

<head>
  <!-- Plotly.js -->
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>

<body>
  <!-- Plotly chart will be drawn inside this DIV -->
  <div id="myDiv"></div>
</body>

</html>

在上面的示例中，当您将鼠标悬停在行尾时，将显示辅助线。我发现有一种方法可以通过创建第二个场景来隐藏辅助线，其中showspikes: false会在不同的轴上显示：

var traces = [];
traces.push({
  type: 'scatter3d',
  mode: 'markers',
  x: [0, 1],
  y: [0, 1],
  z: [0, 1],
});

traces.push({
  type: 'scatter3d',
  mode: 'lines',
  hoverinfo: 'none',
  scene: 'scene2',
  x: [1, 0],
  y: [0, 1],
  z: [0, 1]
});

layout = {
  scene2: {
    xaxis: {
      showspikes: false
    },
    yaxis: {
      showspikes: false
    },
    zaxis: {
      showspikes: false
    }
  }
};
Plotly.newPlot('myDiv', traces, layout);

<html>

<head>
  <!-- Plotly.js -->
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>

<body>
  <!-- Plotly chart will be drawn inside this DIV -->
  <div id="myDiv"></div>
</body>

</html>

是否有一种方法可以只为线图隐藏辅助线（我不确定这是否是正确的表达式），而无需创建第二条轴？

plotly.js：隐藏所选跟踪的辅助线

0 个答案: