Daten mit Paar X- und Y-Werten

Question

Ist es möglich, ein Paar X und Y in der Option data in Chart.js zu verwenden, um den Balken zu erstellen?

data: [ 
    ['08/09/2016', 12], 
    ['09/09/2016', 19] 
], 

Sein in Form von [X, Y]

ich fand keine Erwähnung in der Dokumentation. Je näher ich bekam, war dies in den line charts example gefunden:

  data: [{ 
       x: -10, 
       y: 0 
      }, { 
       x: 0, 
       y: 10 
      }, { 
       x: 10, 
       y: 5 
      }] 

Answer 1

Es gibt keine integrierte Möglichkeit, Ihr Diagramm mit einem Array direkt in die Daten zu erstellen.

Aber Sie können eine kleine Arbeit mit Chart.js plugins erstellen. Sie lassen Sie behandeln Ereignisse während der gesamten Schöpfung des Diagramms ausgelöst, wie, bevor es initialisiert wird, nach einer Resize usw.

---

Folgt ein kleines Plugin, das alle Daten für Sie mit einem Array bevölkern:

var myPlugin = { 
    // We edit what is happening before the chart is initialized. 
    beforeInit: function(chart) { 
     var data = chart.config.data; 

     // `APIarray` is what you get from your API. 
     // For every data in this array ... 
     for (var i = 0; i < APIarray.length; i++) { 
      // Populate the labels array with the first value .. 
      data.labels.push(APIarray[i][0]); 
      // .. and the data with the second value 
      data.datasets[0].data.push(APIarray[i][1]); 
     } 
    } 
}; 

Dann müssen Sie diese neu erstellte Plug-in Ihrem Diagramm Plugin Dienste hinzuzufügen:

Chart.pluginService.register(myPlugin); 

---

Stellen Sie sicher, das Plugin vor Erstellen Sie das Diagramm registrieren ( vor dem Aufruf new Chart()), sonst wird es nicht funktionieren.
Ich empfehle auch, eine leere Daten in Ihrem Diagramm (bevor das Plugin auftritt) zu haben, um sicherzustellen, dass Sie nicht Daten haben, die Sie nicht wollen.

Sie können ein vollständig funktionierendes Beispiel on this jsFiddle sehen.