Plotly.extendTraces 仅适用于两条跟踪，但不适用于三条

function getData() {
  return Math.random();
};
function plotGraph(graph_div) {
  let UPDATE_INTERVAL = 300;
  Plotly.plot(graph_div, [{
    y: [1, 2, 3].map(getData),
    name: 'x',
    mode: 'lines',
    line: { color: '#80CAF6' }
  }, {
    y: [1, 2, 3].map(getData),
    name: 'y',
    mode: 'lines',
    line: { color: '#DF56F1' }
  }, {
    y: [1, 2, 3].map(getData),
    name: 'z',
    mode: 'lines',
    line: { color: '#4D92E9' }
  }]);
  var cnt = 0;
  var interval = setInterval(function () {
    var time = new Date();
    Plotly.extendTraces(graph_div, {
      y: [[getData()], [getData()], [getData()]]
    }, [0, 1])
    cnt = cnt+1;
    if (cnt === 100) clearInterval(interval);
  }, UPDATE_INTERVAL);
}

错误：

plotly-latest.min.js:7 Uncaught Error: attribute y must be an array of length equal to indices array length
    at plotly-latest.min.js:7
    at R (plotly-latest.min.js:7)
    at Object.t [as extendTraces] (plotly-latest.min.js:7)
    at realtime_vis.js:40

指向

Plotly.extendTraces(graph_div, {
      y: [[getData()], [getData()], [getData()]]
    }, [0, 1])

官方文档中的示例仅显示了如何绘制 2 行，但该示例不适用于三行。有什么帮助吗？我假设我可以显式指定数组的大小？！

Plotly 文档在这里不是很清楚，但第三个参数是您要修改的绘图索引数组。

在您的情况下，您告诉 Plotly 修改[0, 1]但您提供了 3 个新的 y 值。如果将其更改为[0, 1, 2]它应该可以工作，或者只能提供两个新的 y 值。

function getData() {
  return Math.random();
};
Plotly.plot(graph_div, [{
	y: [1, 2, 3].map(getData),
	name: 'x',
	mode: 'lines',
	line: { color: '#80CAF6' }
}, {
	y: [1, 2, 3].map(getData),
	name: 'y',
	mode: 'lines',
	line: { color: '#DF56F1' }
}, {
	y: [1, 2, 3].map(getData),
	name: 'z',
	mode: 'lines',
	line: { color: '#4D92E9' }
}]);
var cnt = 0;
var interval = setInterval(function () {
	var time = new Date();
	Plotly.extendTraces(graph_div, {
		y: [[getData()], [getData()], [getData()]]
	}, [0, 1, 2])
	cnt = cnt+1;
	if (cnt === 100) clearInterval(interval);
}, 300);

<head>
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
  <div id="graph_div"></div>
</body>

相关内容

最新更新

热门标签：