How to clear plotly graph via js before new plot?

Viewed 14

I have a div which gets assigned an initial graph.

<div id='chart' class='chart'”></div>
new gridjs.Grid({
        columns: [
          { id: 'datum', name: 'Datum' },
          { id: 'betreff', name: 'Betreff' },
          { id: 'wert', name: 'Wert', sort: false , 'attributes': editableCellAttributes},
        ],
        data: [
          {% for e in data %}
            {
              datum: '{{ e.datum }}',
              betreff: '{{ e.betreff }}',
              wert: '{{ e.wert }}'
            },
          {% endfor %}
        ],
      }).render(document.getElementById('table'));

Output looks like this:

output ((a,5), (b,7)

I use ajax to update content via

$.ajax({
    type : "POST",
    url : "/api/data",
    data: JSON.stringify("a", "b", '\t'),
    contentType: 'application/json;charset=UTF-8',
    success: function(result) {
        document.getElementById("chart").innerHTML = "";
        var graphs = JSON.parse(result);
        Plotly.plot('chart',graphs,{});
        console.log(graphs)
    }
});

which delivers three points ((a,3),(b,2),(c,1)). Why is this graph plotted on top of the old graph? I want only the new values to be shown, in this example ((a,3),(b,2),(c,1)).

old points included (yellow)

I tried clearing the div before new plot, but this deletes my whole div.

document.getElementById("chart").innerHTML = "";
0 Answers
Related