Heim > Backend-Entwicklung > PHP-Tutorial > Ausführliche Erklärung zum Erstellen dynamischer Diagramme in PHP basierend auf CanvasJS

Ausführliche Erklärung zum Erstellen dynamischer Diagramme in PHP basierend auf CanvasJS

coldplay.xixi
Freigeben: 2023-04-09 12:28:02
nach vorne
2754 Leute haben es durchsucht

<img src="https://img.php.cn/upload/article/202008/04/2020080415471934199.jpg" alt="Ausführliche Erklärung zum Erstellen dynamischer Diagramme in PHP basierend auf CanvasJS" >

CanvasJS ist eine JavaScript-Bibliothek zum einfachen Erstellen anderer Diagrammtypen für Webseiten. Zum Beispiel Balkendiagramm, Kreisdiagramm, Säulendiagramm, Flächendiagramm, Liniendiagramm usw.

Nehmen wir das Beispiel, dass wir ein Diagramm erstellen müssen, in dem wir die jeden Monat verkauften und gekauften Produkte anzeigen können. Wir betrachten zwei Arrays, wir können sie auch aus der Datenbank betrachten. Sobald wir die Daten aus der Datenbank erhalten und in einem Array speichern, können sie mit CanvasJS problemlos mit dynamischen Grafiken gezeichnet werden.

Erstellen Sie eine Datei und speichern Sie sie im Projektordner. Der Dateiname chart_sample.php enthält Daten in Form von Arrays, wobei das erste Array die gekauften Produkte und das zweite Array die Sols-Produktliste darstellt. Verwenden Sie nun canvasJS, um die Grafiken zu zeichnen.

Zum Beispiel:

<?php 
// First array for purchased product 
$purchased= array(10, 15, 19, 0, 5, 7, 0, 0, 12, 13, 10, 1);

// Second array for sold product 
$sold= array(7, 12, 14, 0, 3, 7, 0, 0, 10, 7, 5, 0);

// Data to draw graph for purchased products 
$dataPoints = array( 
  array("label"=> "Jan", "y"=> $purchased[0]), 
  array("label"=> "Feb", "y"=> $purchased[1]), 
  array("label"=> "March", "y"=> $purchased[2]), 
  array("label"=> "April", "y"=> $purchased[3]), 
  array("label"=> "May", "y"=> $purchased[4]), 
  array("label"=> "Jun", "y"=> $purchased[5]), 
  array("label"=> "July", "y"=> $purchased[6]), 
  array("label"=> "Aug", "y"=> $purchased[7]), 
  array("label"=> "Sep", "y"=> $purchased[8]), 
  array("label"=> "Oct", "y"=> $purchased[9]), 
  array("label"=> "Nov", "y"=> $purchased[10]), 
  array("label"=> "Dec", "y"=> $purchased[11]) 
);

// Data to draw graph for sold products 
$dataPoints2 = array( 
  array("label"=> "Jan", "y"=> $sold[0]), 
  array("label"=> "Feb", "y"=> $sold[1]), 
  array("label"=> "March", "y"=> $sold[2]), 
  array("label"=> "April", "y"=> $sold[3]), 
  array("label"=> "May", "y"=> $sold[4]), 
  array("label"=> "Jun", "y"=> $sold[5]), 
  array("label"=> "July", "y"=> $sold[6]), 
  array("label"=> "Aug", "y"=> $sold[7]), 
  array("label"=> "Sep", "y"=> $sold[8]), 
  array("label"=> "Oct", "y"=> $sold[9]), 
  array("label"=> "Nov", "y"=> $sold[10]), 
  array("label"=> "Dec", "y"=> $sold[11]) 
);

?>
Nach dem Login kopieren
rrree

Verwandte Lernempfehlungen: PHP-Programmierung vom Einstieg bis zum Master

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zum Erstellen dynamischer Diagramme in PHP basierend auf CanvasJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:jb51.net
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage