Top-Themen

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

Anleitung Entwicklung PHP

Ein einfaches Tortendiagramm in 3D mit Daten aus einer MySQLtabelle

Mitglied: Guenni

Guenni (Level 2) - Jetzt verbinden

22.01.2014, aktualisiert 24.01.2014, 3545 Aufrufe, 4 Danke

Warum einfach?


Weil das Skript keinen 1000- und mehrzeiligen Code enthält, wie bei einer professionellen Anwendung, und die Funktionalität deshalb natürlich sehr eingeschränkt ist. Es lässt sich auch nur ein einziges Diagramm darstellen, dessen Aussehen durch ein paar Daten aus einer Tabelle und einigen Parametern in der URL gesteuert wird, wenn das Skript in einer Webseite eingebunden wird.

Die Tabelle


Beispiel mit fiktiven Werten: Wahlergebnisse 2017 in Deutschland

ID Kategorie Wert
1 CDU/CSU 42.7
2 SPD 23.4
3 Linke 13.7
4 Grüne 9
. . . usw.

Das Diagrammskript wird nun auf einer Webseite ganz normal wie eine Grafik eingebunden.


01.
<img src = script_name.php>

Folgende Parameter werden noch an die URL angehangen:


tabelle=tabellenname -- Tabelle, die abgefragt wird
order=spaltennumer -- Nach welcher Spalte soll sortiert werden
richtung=asc oder desc -- aufsteigende oder absteigende Sortierung
start=position -- Ist Position=0, fängt das Diagramm im Kreis bei 3:00 Uhr an. Mit Werten < 0 oder > 0 läßt sich die Startposition verschieben
titel=Überschrift der Legende
einheit=Einheitensymbol oder Einheitenbezeichner -- kg, Stück, %, Einwohner etc., was eben zu den Daten passt
breite=wert -- Breite der Grafik
hoehe=wert -- Höhe der Grafik, wobei die tatsächliche Höhe pro Datensatz um 20 Pixel erhöht wird, damit Platz für die Legende ist
bgcolor=h_wert1,h_wert2,h_wert3 -- Die Hintergrundfarbanteile der Grafik, wobei jeder Wert zwischen 0 und 255 liegen kann
farbwahl=f_wert1,f_wert2 -- Die Farben der einzelnen Tortenstücke
winkel_para=größe,neigung -- Größe der Tortenstücke und Neigung des Diagramms.

Zur Farbwahl der Tortenstücke


Im Skript wird eine Farbtabelle mit 216 Einträgen erstellt (0 - 215). Schema der Tabelle: farbtabelle[index][farbanteil_1][farbanteil_2][farbanteil_3]
Die jeweiligen Farbanteile werden in verschachtelten for-Schleifen von 255 - 0 runtergezählt, wobei bei jedem Durchlauf die Farbanteile um 51 reduziert werden.
Mit f_wert1 gibt man den Index eines Arrays der Farbtabelle an, dessen Farben als erstes genutzt werden. Mit jedem Datensatz wird f_wert2 auf f_wert1 aufaddiert und bestimmt den Index des nächsten Arrays. Idealerweise sollte f_wert2 größer als 1 sein, damit die Farben im Diagramm nicht zu ähnlich sind.
Ich hoffe, das war einigermaßen verständlich. Bisschen experimentieren mit den Werten, auch mit den Hintergrundfarben

Das Skript wird dann entsprechend als Grafik eingebunden


01.
<img src="a_1diagramm2.php?tabelle=statistik&order=2&richtung=asc&start=0&titel=Bundestagswahlen 2017 in Detuschland&einheit=%&breite=400&hoehe=400&bgcolor=169,169,169&farbwahl=20,5&winkel_para=1.2,2" title="Bundestagswahlen 2017 in Deutschland">
Das Ergebnis könnte dann so ähnlich aussehen:

ca6c2e0aa036c9e87cee366af2dce600 - Klicke auf das Bild, um es zu vergrößern

Das Diagrammskript:


01.
<?php 
02.
header("Content-type: image/png"); 
03.
$conn = new PDO("mysql:host=localhost;dbname=test", "guenni", "guenni"); 
04.
$stmt = $conn->prepare("select * from ".$_GET["tabelle"]." order by ".$_GET["order"]." ".$_GET["richtung"]); 
05.
$stmt->execute(); 
06.
$ergebnisse = $stmt->fetchAll(PDO::FETCH_ASSOC); 
07.
 
08.
$tabelle = array(); 
09.
foreach($ergebnisse as $ergebnis){ 
10.
 $tabelle[] = $ergebnis
11.
12.
/* 
13.
* Für jede Zeile der Legende eine Zeile mit 20 Pixel reservieren 
14.
*/ 
15.
$zeilen_legende = count($tabelle) * 20; 
16.
/* 
17.
* eine Grafik erstellen 
18.
*/ 
19.
$breite = $_GET["breite"]; 
20.
$hoehe = $_GET["hoehe"]; 
21.
$winkel_para = explode(",",$_GET["winkel_para"]); 
22.
$mittelpunkt_x = $breite/2; 
23.
$mittelpunkt_y = $hoehe/2 - 50; 
24.
$abstand_zum_rand = 30; 
25.
$winkel_breite = $breite/$winkel_para[0]; 
26.
$winkel_hoehe = $hoehe/$winkel_para[1]; 
27.
 
28.
$img = imagecreatetruecolor($breite, $hoehe + $zeilen_legende); 
29.
/* 
30.
* Den schwarzen Hintergrund der Grafik durch einen hellen Hintergrund ersetzen 
31.
*/ 
32.
$bgcolor = explode(",",($_GET["bgcolor"])); 
33.
imagefilledrectangle ($img , 0, 0, $breite, $hoehe + $zeilen_legende, imagecolorallocate($img, $bgcolor[0], $bgcolor[1], $bgcolor[2])); 
34.
/* 
35.
* Die Schlüssel (Spaltennamen der Tabelle) des Arrays speichern 
36.
*/ 
37.
$keys = array_keys($tabelle[0]); 
38.
/* 
39.
* Eine Farbtabelle aufbauen 
40.
* Die Farbtabelle enthält so 216 Einträge, sollte reichen für ein Diagramm 
41.
*/ 
42.
$farbtabelle = array(); 
43.
for($i = 255;$i >= 0;$i -= 51){ 
44.
 for($j = 255;$j >= 0;$j -= 51){ 
45.
  for($k = 255;$k >= 0;$k -= 51){ 
46.
	 $farbtabelle[] = array($i, $j, $k); 
47.
48.
49.
50.
/* 
51.
* Im Array daten werden die statistischen Werte gespeichert 
52.
* Im Array farben1 werden die Farben mit Transparenz gespeichert 
53.
* Im Array farben2 werden die Farben ohne Transparenz gespeichert 
54.
*/ 
55.
$tabellen_index = 0; 
56.
$farbwahl = explode(",", $_GET["farbwahl"]); 
57.
$farbindex = $farbwahl[0]; 
58.
$farbindex_schritt = $farbwahl[1]; 
59.
foreach($tabelle as $data){ 
60.
 if($farbindex > 215) $farbindex = 0; 
61.
 $daten[$tabelle[$tabellen_index][$keys[1]]] = $data[$keys[2]]; 
62.
 $farben1[$tabelle[$tabellen_index][$keys[1]]] = imagecolorallocatealpha($img, $farbtabelle[$farbindex][0], $farbtabelle[$farbindex][1], $farbtabelle[$farbindex][2], 120); 
63.
 $farben2[$tabelle[$tabellen_index][$keys[1]]] = imagecolorallocate($img, $farbtabelle[$farbindex][0], $farbtabelle[$farbindex][1], $farbtabelle[$farbindex][2]); 
64.
 $tabellen_index++; 
65.
 $farbindex += $farbindex_schritt
66.
67.
/* 
68.
* Die Konstante GRAD bekommt die Schrittweite zugewiesen 
69.
*/ 
70.
define("GRAD", 360/array_sum($daten)); 
71.
/* 
72.
* Bei start=0 beginnt das Diagramm. Enspricht im Kreis der Position 3:00 Uhr 
73.
* Ein negativer Wert verschiebt start gegen den Uhrzeiger 
74.
* Ein Wert > 0 verschiebt start mit den Uhrzeiger 
75.
*/ 
76.
$start = $_GET["start"]; 
77.
/* 
78.
* effekt_hoehe bestimmt die Höhe des Diagramms 
79.
*/ 
80.
$effekt_hoehe = 25; 
81.
$drei_d = $mittelpunkt_y + $effekt_hoehe
82.
/* 
83.
* Zuerst wird das dreidimensionale Diagramm mit den transparenten Farben gezeichnet 
84.
*/ 
85.
for($i = $drei_d;$i > $mittelpunkt_y;$i--){ 
86.
 foreach($daten as $key => $value){ 
87.
  $ende = $start + $daten[$key] * GRAD; 
88.
	imagefilledarc($img, $mittelpunkt_x, $i, $winkel_breite, $winkel_hoehe, $start, $ende, $farben1[$key], IMG_ARC_PIE); 
89.
 	$start = $ende
90.
91.
92.
/* 
93.
* Darauf wird das Diagramm mit den nicht transparenten Farben gezeichnet 
94.
*/ 
95.
foreach($daten as $key => $value){ 
96.
 $ende = $start + $daten[$key] * GRAD; 
97.
 imagefilledarc($img, $mittelpunkt_x, $mittelpunkt_y, $winkel_breite, $winkel_hoehe, $start, $ende, $farben2[$key], IMG_ARC_PIE); 
98.
 $start = $ende
99.
100.
 
101.
//Legende 
102.
$zeile = $hoehe - $hoehe/10; 
103.
imagestring ($img , 5, 20, $zeile, $_GET["titel"], imagecolorallocate($img, 0, 0, 0)); 
104.
$zeile += 20; 
105.
foreach($daten as $key => $value){ 
106.
 imagestring ($img , 5, 40, $zeile, $key." - ".$daten[$key]." ".$_GET["einheit"], $farben2[$key]); 
107.
 $zeile += 20; 
108.
109.
 
110.
//Grafik ausgeben 
111.
imagepng($img); 
112.
 
113.
//Speicher freigeben 
114.
imagedestroy($img); 
115.
?>
Gruß
Günni
Ähnliche Inhalte
Off Topic
Arbeitgeber dürfen Mitarbeiterchats nicht einfach überwachen
Information von transoceanOff Topic6 Kommentare

Moin, das hat der Europäische Gerichtshof für Menschenrechte geurteilt. Hier das Original Dokument (englisch) vom Europäische Gerichtshof für Menschenrechte ...

Linux
Performance-Schub für 3D-Treiber von Linux, MESA 17.2 freigegeben
Information von BassFishFoxLinux1 Kommentar

Muss ich glatt mal bei Gelegenheit auf meine Hardware loslassen. BFF

Datenschutz
Microsoft: Welche Daten werden eigentlich gesammelt?
Information von FrankDatenschutz21 Kommentare

Da ich in einigen Diskussionen auf unserer Seite feststellen musste, dass die wenigsten Admins oder ITPros wirklich wissen, was ...

Hardware
Daten zum Stromverbrauch für Bitcoin-Mining
Information von DerWoWussteHardware7 Kommentare

listet einige Fakten und Schätzungen zum aktuellen Stromverbrauch durch Bitcoin-Mining auf. Wenn man den Schätzungen glauben mag, wird derweil ...

Neue Wissensbeiträge
Microsoft

Letzte Updates für Win10 und Server2016 müssen bei Bedarf über den Update catalogue in den WSUS importiert werden!

Tipp von DerWoWusste vor 2 StundenMicrosoft

automatisch kommt da nichts an im WSUS und auch nicht im SCCM. Siehe Hinweise zum Bezug der jeweils neuesten ...

Linux

Meltdown und Spectre: Linux Update

Information von Frank vor 2 TagenLinux

Meltdown (Variante 3 des Prozessorfehlers) Der Kernel 4.14.13 mit den Page-Table-Isolation-Code (PTI) ist nun für Fedora freigegeben worden. Er ...

Tipps & Tricks

Solutio Charly Updater Fehlermeldung: Das Abgleichen der Dateien in -Pfad- mit dem Datenobject ist fehlgeschlagen

Tipp von StefanKittel vor 3 TagenTipps & Tricks

Hallo, hier einmal als Tipp für alle unter Euch die mit der Zahnarztabrechnungssoftware Charly von Solutio zu tun haben. ...

Sicherheit

Meltdown und Spectre: Wir brauchen eine "Abwrackprämie", die die CPU-Hersteller bezahlen

Information von Frank vor 3 TagenSicherheit13 Kommentare

Zum aktuellen Thema Meltdown und Spectre: Ich wünsche mir von den CPU-Herstellern wie Intel, AMD oder ARM eine Art ...

Heiß diskutierte Inhalte
Firewall
Penetrationstester-Labor - Firewalls
Frage von Oli-nuxFirewall10 Kommentare

Mich würde interessieren warum man beim Einrichten eines Penetrationstester-Labor (VMs) die Firewall der Systeme deaktivieren soll? Hat das nur ...

SAN, NAS, DAS
Wer kennt sich mit QNAP und CISCO aus ?
gelöst Frage von MachelloSAN, NAS, DAS9 Kommentare

Hallo Zusammen hier im Forum, Ich habe ein QNas 451+ und dieses NAS hat zwei GBit Lan Adapter die ...

Netzwerkgrundlagen
IPv6 Inter-VLAN Routing
gelöst Frage von clSchakNetzwerkgrundlagen9 Kommentare

Hi ich befasse mich gerade mit der Implementierung von IPv6 was bisher (in einem VLAN) korrekt funktioniert inkl. DNS ...

Windows Netzwerk
Ist ein Portforwarding auf einen PC ohne lauschendes Programm ein (großes) Sicherheitsproblem?
Frage von PluwimWindows Netzwerk8 Kommentare

Hallo zusammen, zur Fernwartung eines Rechners an einem anderen Ort nutze ich VNC. Da dieser Rechner einfach nur eine ...