Утечка памяти при вызове Plotly.plot () в цикле (JavaScript) - PullRequest
Новая
       104

Утечка памяти при вызове Plotly.plot () в цикле (JavaScript)

1 голос
/ 05 ноября 2019

Я также разместил это на форуме plotly, но этот форум, кажется, не очень активен ...

Привет всем,

Я использую plotly.js в большемПриложение Asp.Net Webforms (также используются элементы управления telerik) и столкнулось с утечками памяти (протестировано в IE11). Я попробовал разные вещи и создал небольшой пример (см. Код ниже). В коде я создаю график гистограммы с 4000x4000 случайных точек данных и строю их 10 раз в цикле (нажмите кнопку «Replot Traces»)Я ожидаю, что новый plot () - вызов в следующей итерации просто «переопределяет» сюжет итерации ранее. Но использование памяти увеличивается до тех пор, пока у меня не кончится память ...

Удаление всего графика или вызов ГХ не помогает (память немного уменьшается).

У кого-нибудь былоаналогичные проблемы и имеет представление, как справиться с этим. Есть ли способ полностью сбросить / очистить график без перезагрузки всей страницы (потому что в моем большом приложении я использую Ajax и не могу каждый раз перезагружать всю страницу)?.

Заранее спасибо! 

<head>
  <!-- Plotly.js -->
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
  <div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
  <div id="delete" style="margin-left:80px;">
      <button style="background: red;" onclick="deletePlot()">Delete/Purge</button>
  </div>

  <div style="margin-left:80px;">
      <button style="background: green;" onclick="plotAll()">Replot Traces</button>
  </div>

  <div style="margin-left:80px;">
      <button style="background: blue;" onclick="CallGC()">Call GC</button>
  </div>

    <script>
        function deletePlot(){
            Plotly.purge('myDiv');
        }

        function plotAll()
        {
            var n = 4000

            var s2dArray = '[';
            for (var i=0; i <n; i++)
            {
                s2dArray = s2dArray.concat('[');
                for (var j=0; j <n; j++)
                {
                    s2dArray = s2dArray.concat(Math.round((Math.random() * 100) + 1));
                    if(j < n-1)
                    {
                        s2dArray = s2dArray.concat(',');
                    }
                }
                s2dArray = s2dArray.concat(']');
                if(i < n-1)
                {
                    s2dArray = s2dArray.concat(',');
                }
            }
            s2dArray = s2dArray.concat(']');

            var data = [
            {
                z: JSON.parse(s2dArray),
                type: 'heatmap'
                }
            ];

            for(var i =0; i<10; i++)
            {
                Plotly.plot('myDiv', data, {}, {showSendToCloud: true});
                console.log(i);
            }
        }

        function CallGC()
        {
            CollectGarbage();
        }
    </script>
</body>
...