Balkendiagramme in PHP mithilfe von GD-Funktionen

In diesem Beispiel werden dem PHP-Skript ein oder mehrere Datenwerte übergeben, aus denen eine Reihe von Rechtecken erstellt werden, die ein Diagrammbild erzeugen. Da es sich um dynamische Daten handeln wird, muss die Funktion zur Diagrammerzeugung in der Lage sein, Daten über den Query-String der Bildquelle zu empfangen:


<img src="chart_image.php?pt1=25&pt2=58&…">

Das PHP-Skript übernimmt dann diese Informationen, erzeugt das Diagrammbild und gibt das erzeugte Bild mit den gestalteten Balken zurück.

Zudem soll es möglich sein, um das Diagrammbild herum Ränder hinzuzufügen. So lässt sich das Diagramm um Bilddaten als Text ergänzen und an den Achsen können Markierungen hinzugefügt werden.

Zuerst definiert man einige lokale Variablen, die konstante Information festhalten:

Diese Variablen haben folgende Funktion:

  • $bar_w ist die Balkenbreite für jeden einzelnen Balken im Diagramm.
  • $max_y ist der maximale Y-Wert im Diagramm.
  • Die $margin_x-Variablen geben die Breite der Ränder an.
  • $y_div ist der Abstand der Markierungen auf der Y-Achse.
  • $rects ist das Array der Rechteckpunkte.

Nun wird es Zeit, die einzelnen Rechtecke zu berechnen, welche die Daten repräsentieren. Man iteriert hierzu über die Liste von ptN-Elementen, die als GET-Information (Query-String) gesendet werden, um die Rechteckpunkte zu konstruieren (Listing A).

Listing A

Dieser Code speichert die Rechteckskoordinaten im Array $rects als Array von Punkten: [x1, y1, x2, y2]. Der logische Ursprung der Koordinatendaten ist die Position links unten in der graphischen Darstellung, und der Ursprung des Bildes ist die obere linke Position des Bildes. Deshalb müssen die Daten zu Bildkoordinaten konvertiert werden. Dazu berechnet man einfach den Wert auf der y-Achse ($margin_top + $max_y) und subtrahiert den Datenwert ($_GET[$pt]) – wobei $Pt „Pt“ plus dem Iterationswert entspricht. Hierbei sind mehrere Datenpunkte zu berücksichtigen:

  • Der y2-Wert liegt stets auf der y-Achse.
  • Die x-Koordinatendaten werden berechnet, indem man den letzten x2-Wert als x1 nimmt und die Breite addiert, um die x2-Koordinate des neuen Rechtecks zu erhalten.
  • Die Gesamtbildbreite entspricht dem letzten x2-Wert plus rechtem Rand, und die Gesamtbildhöhe ist die y-Achse plus unterer Rand.

Page: 1 2 3

ZDNet.de Redaktion

Recent Posts

Lags beim Online-Gaming? DSL-Vergleich und andere Tipps schaffen Abhilfe

Beim Online-Gaming kommt es nicht nur auf das eigene Können an. Auch die technischen Voraussetzungen…

2 Tagen ago

GenKI-Fortbildung immer noch Mangelware

Fast jedes zweite Unternehmen bietet keinerlei Schulungen an. In den übrigen Betrieben profitieren oft nur…

2 Tagen ago

Netzwerk-Portfolio für das KI-Zeitalter

Huawei stellt auf der Connect Europe 2024 in Paris mit Xinghe Intelligent Network eine erweiterte…

2 Tagen ago

Internet-Tempo in Deutschland: Viel Luft nach oben

Höchste Zeit für eine schnelle Kupfer-Glas-Migration. Bis 2030 soll in Deutschland Glasfaser flächendeckend ausgerollt sein.

2 Tagen ago

Erste Entwickler-Preview von Android 16 verfügbar

Schon im April 2025 soll Android 16 den Status Plattformstabilität erreichen. Entwicklern gibt Google danach…

2 Tagen ago

Kaspersky warnt vor Cyberangriff auf PyPI-Lieferkette

Die Hintermänner setzen KI-Chatbot-Tools als Köder ein. Opfer fangen sich den Infostealer JarkaStealer ein.

3 Tagen ago