使用缩放插件实例后的 Chart.js v3 在内存中持久化

问题描述

我最近将 Chart.js 从 v2.x 切换到 3.x。我还使用了与 v3.x 版本兼容的 chartjs-plugin-zoom 1.0.1。我的情况是我有一个带有一些选项卡的 SPA，一个选项卡上是图表，在它们之间是折线图，对于这个我使用缩放插件，因为数据通常很大。我的选项看起来像

this._options = {
            animation: false,responsive: true,tooltips: {
                mode: 'nearest',intersect: false
            },maintainAspectRatio: false,legend:
            {
               display: false
            },scales: {
                x: 
                {  
                    title:
                    {
                        display: true,text: `Message order`
                    },},y: 
                {  
                    title:
                    {
                        display: true,text: `log10 of time difference`
                    },}
            },plugins: {
                legend: {
                    display: false
                },zoom: {
                    zoom: {
                      wheel: {
                        enabled: true,drag: 
                      {
                          enabled: true,borderWidth: 1
                      },mode: 'x',}
                },decimation: {
                    enabled: true
                }
            }
        };

当我从带有图表的页面转换到另一个页面时，这被称为清理：

if (this._chart)
{
    this._chart.options.onClick = null;
    //desperate attempt to save situation
    this._chart.options.plugins = null;
    this._chart.clear();
    this._chart.destroy();
}

我希望 destroy 从内存角度做所有必要的事情。对于版本 2，它正在工作，但在这里我观察到奇怪的行为。当我从图表页面切换到另一个页面并检查内存时，我看到了对象之间的 LineController（与 chart.js 相关的对象）。当我切换回图表页面，然后再次切换到另一个内存消耗增加和 LineController 计数。

当我从选项中评论缩放插件时，我发现了这一点

zoom: {
                    zoom: {
                      wheel: {
                        enabled: true,}
                }

一切都恢复正常了，不再增加 LineControll 实例，在页面切换之间没有增加可见的内存消耗。但是这个插件对我来说是必要的，所以注释掉不是一个好选择。我尝试将图表的插件手动设置为空：

this._chart.options.plugins = null;

但这并不能解决内存问题。有人遇到过这种情况吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

chartjs-plugin-zoom javascript memory-leaks