multiple chartjs in the same page

Question

hi i was trying to use chartjs can be found in this link www.chartjs.org

i tried to draw two chart in the same page using the samples code

i created two different div with two different ids

like this

<div id="chart1"></div> <div id="chart2"></div> 

then after including this line :

i created the first chart this way:

 window.onload = function(){     var ctx1 = document.getElementById("chart1").getContext("2d");     window.myLine = new Chart(ctx1).Line(lineChartData, {         responsive: true     }); } 

and the second chart this way :

   window.onload = function(){         var ctx2 = document.getElementById("chart2").getContext("2d");         window.myPie = new Chart(ctx2).Pie(pieData);     }; 

data used for both chart is the same like as samples , so nothing changed but if i draw just one chart by itself it works great if i put the two chart at the same time i get only the pie chart

can you tell me where is the problem please i think it is some sort of conflict , but i can't find it

Answer 1

Use only one window.onload

window.onload = function () {         window.myRadar = new Chart(document.getElementById("canvas1").getContext("2d")).Radar(radarChartData, {             responsive: true         });         var G2 = document.getElementById("canvas2").getContext("2d");         window.myBar = new Chart(G2).Bar(barChartData, {             responsive: true         });     }