Wie kann ich mehrere Chartjs-Diagramme mit unterschiedlichen Daten auf derselben Seite laden?

Question

Ich habe eine Website und einige Charts mit Diagramm js gebaut. Die Daten für die Diagramme befinden sich alle in einer Datei, births.js. Früher gab es mehrere Seiten, so die korrekte Grafik laden ich eine Funktion verwendet, und if-Anweisung für jede Seite

function drawChart() { 
     if (window.location.href.indexOf("scotland") > -1) { 
    } 
    else if(window.location.href.indexOf("index") > -1){ 
    } 

usw.

habe ich jetzt mit mit allem auf einer interaktiven Seite beauftragt worden, also wird der indexOf immer nur index sein. Gibt es eine Möglichkeit, die Funktion neu zu schreiben, so dass ich die verschiedenen Daten auf der gleichen Seite laden kann?

Answer 1

Nun, dann können Sie verschiedene IDs für verschiedene Diagramme verwenden. Nicht einmal das kann jedes jquery oder js Plugin so verwendet werden.

<canvas id="yourid1" width="400" height="400"></canvas><canvas id="yourid2" width="400" height="400"></canvas> 
var ctx = document.getElementById("yourid2"); 
var myChart = new Chart(ctx, { 
    type: 'bar', 
    data: { 
     labels:......///and so on for your another charts 
    var ctx = document.getElementById("yourid1"); 
    var myChart = new Chart(ctx, { 
     type: 'bar', 
     data: { 
      labels:.......///not the complete code. just reference 

gleiche wieder mit einer anderen ID für verschiedene Diagramme

<canvas id="yourid2" width="400" height="400"></canvas> 
var ctx = document.getElementById("yourid2"); 
var myChart = new Chart(ctx, { 
    type: 'bar', 
    data: { 
     labels:......///and so on for your another charts