You can simply use native HTML to have checkboxes.

<div id='myChart'></div>
<input data-index='0' type='checkbox' id='pa' checked>
<label for='pa'>Dataset 1</label>
<input data-index='1' type='checkbox' id='pb' checked>
<label for='pa'>Dataset 2</label>
<input data-index='2' type='checkbox' id='pc' checked>
<label for='pa'>Dataset 3</label>
<input data-index='3' type='checkbox' id='pd' checked>
<label for='pa'>Dataset 4</label> 

 From there you will use our API to attach events to toggle the plots through an event listener.

// get all inputs
var inputSelectors = document.querySelectorAll('input');
 
inputSelectors.forEach(function(input) {
  input.addEventListener('click',updateChartData);
});
 
function updateChartData(e){
  var seriesIndex = this.dataset['index'];
 
  zingchart.exec('myChart', 'toggleplot',{
    plotindex: seriesIndex
  });
};

Relative Links:

  1. live demo
  2. API docs
Did this answer your question?