Multi-checkboxes And Chart Data

👍:0

You have a couple of program flow related stuff you have to take care of.

datas1 needs to be initialized before you attempt to set data using it. So you need to call validate(), not just declare it. In validate(), datas1 will be set only if the checkbox is checked. For now, let’s simply check it using HTML (when you add the rest of your code, just remember not to attempt setting data unless datas1 is set i.e. the corresponding checkbox is checked)

 <input id="DFN001" type="checkbox" name="DFN001" onclick="check()" value="from" checked>From DFN001

Calling validate is pretty simple

    ...
    validate();

    var ctx1 = document.getElementById...

You need to call new Chart to actually render the chart. Something like

new Chart(ctx1).Line(lineChartData1);

Finally you need to have the canvas element in your HTML (I assume you already have this – just included for completeness)

<canvas id="chart_1"></canvas>

In short, you’ll need to call the Chart initialization, data initialization, etc. (on your checkbox clicks) keeping the above in mind.


Here’s a fiddle with all the above changes – http://jsfiddle.net/cy2spqrg/

Leave a comment