[Chartjs]-Hide dataset by default using Chart.js and a custom script

by

0👍

✅

The solution is:

<script type="text/javascript">
jQuery(window).load(function(){
    if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
    wpDataChartsCallbacks[2] = function(obj){
        obj.options.data.datasets[5].hidden = true;
    }
});
</script>

5👍

This is taken from the ChartJS GitHub.

You set the new value and then use the ChartJS API to update the chart to hide the ones you have toggled off. If you wanted to toggle them again you just do the reverse.

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

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

Here’s an example in JSFiddle.

1👍

you just need to add hidden:true to your datasets

{
  label: "something",
  backgroundColor: 'green',
  data: data,
  hidden: true
}

Leave a comment