Question

我有一个包含plot.ly图的页面，我想要将数据写入几次，覆盖之前的内容。

我找不到从plotly.js图中删除所有痕迹的方法，只需重新绘制即可添加数据而不删除旧的。

Answer 1

有两种方法可以做到这一点，都列在plotlyjs function reference page中。

选项1（告诉我们删除有问题的痕迹）：

Plotly.deleteTraces(graphDiv, 0);

其中第二个参数是要删除的跟踪的跟踪索引。请注意，第二个参数也可以是一个索引数组，允许您一次删除多个跟踪。

选项2（用图表说明用新数据制作新图表）：

 Plotly.newPlot(graphDiv, data, layout);

其中参数与Plotly.plot相同。这将创建一个新绘图，仅绘制第二个参数中发送的数据。更准确地说，Plotly.newPlot是幂等的，而Plotly.plot则不是。

Answer 2

你可以删除最后一个跟踪和前一个跟踪，直到最后一个跟踪：

while(graphDiv.data.length>0)
{
      Plotly.deleteTraces(graphDiv, [0]);
}

Answer 3

仅清理图表还不够，还必须清理数据。

这是我绘制散点图的方式：

function tracciaGrafico() {
    data = [];
    trace = [];
    indexTrace = 0;

    // Cleanup only if not first start (else it is already clean, and this would raise an error):
    if (FirstStart) {
        FirstStart = false;
    } else { // Clear chart before plotting if it has already peing plotted.
        Plotly.deleteTraces('myDiv', clearData);
        clearData = [];
    }


    Squadre.forEach(function(squadra) {
        trace[indexTrace] = puntiSquadraCumulativi[squadra]; // Copy trace data from my source array
        data.push(
            {
                x: xArray, 
                y: puntiSquadraCumulativi[squadra], 
                type: "scatter", 
                name: squadra, // from "forEach"
                line: {width: 5}
            }
        ); // Add trace to data array
        clearData.push(indexTrace); // Add trace index to array I will use to clean the old chart
        indexTrace++;
    });
    Plotly.newPlot('myDiv', data); // Plot data
}

在构建图表时，我构建了一个数组（clearData），然后可以用来清除图表：它仅包含所有迹线的所有索引，并且是Plotly.deleteTraces（'myDiv'，clearData的参数））;

但是也许您实际上不想删除跟踪，而只是更新它们：

https://plot.ly/javascript/plotlyjs-function-reference/#plotlyupdate

Plotly update data

High performance way to update graph with new data in Plotly?

Answer 4

Newplot，Purge + newplot，反应和删除跟踪均不起作用。需要有一个直接从plotly直接支持的更好的“清除”功能

从plotly.js图中删除所有痕迹

4 个答案: