javascript - 默认使用 Chart.js 和自定义脚本隐藏数据集

Question

我在我的 WordPress 网站上使用 wpDataTables 插件来绘制一些表格和图表。图表使用 Chart.js 呈现。该插件的开发人员创建了一个自定义脚本来控制 Chart.js 的某些方面，而不是该插件可以处理的开箱即用。

那是脚本:

<script type="text/javascript">
jQuery(window).load(function(){
    if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
    wpDataChartsCallbacks[39] = function(obj){
        obj.options.options.scales.yAxes[0].display = false;
        obj.options.options.scales.xAxes[0].display = false;
    }
});
</script>

在此示例中，它隐藏了 ID 为 39 的图表的轴。我需要更改上述脚本以默认隐藏特定数据集(图表中的线)。我的图表 ID 是 2，我想隐藏标记为“SPM”的数据集。

您可以在此处查看表格和图表(这是游戏的武器概述，所以请不要怀疑): https://mydivision.net/the-division-waffen/

第一个图表默认显示所有数据集:

我希望它默认看起来像这样(“SPM”行隐藏):


任何人都可以请协助如何做到这一点？

Answer 1

这取自 ChartJS GitHub .

您设置新值，然后使用 ChartJS API 更新图表以隐藏您已关闭的图表。如果您想再次切换它们，只需执行相反的操作。

//Hide
chart.getDatasetMeta(1).hidden=true;
chart.update();

//Show
chart.getDatasetMeta(1).hidden=false;
chart.update();

这是 JSFiddle. 中的一个示例