✔ PHP-Diagramm einbinden?

Suchfunktion · 7. September 2006

Hi.

Ich habe mir ein Diagramm durch folgendes Tutorial erstellen lassen:
http://www.webmaster-resource.de/tutorials/php/diagramme-mit-php-dynamisch-erstellen-01.php

Jetzt habe ich die Datei 'image.php' welche beim Aufrufendie erstellte Diagramm-Grafik anzeigt.

Frage:
Wie bekomme ich die Grafik in eine bestehende Seite rein?

Mit Include geht es nicht, da mir dann gesagt wird 'Header allready sent..' (ihr wisst schon), da ich die Grafikdatei per Header als Grafik deklarieren muss, damit sie angezeigt wird.

Eventuell koennte ich die Grafik speichern!?
Da die Grafik immer den gleiche Bezeichnung hat, sollte das machbar sein.

Aber wie speichere ich die Grafik ab?

Hier der Grafikcode:

PHP:

<?php
	// Geschlecht Diagramm
	$XWerte[] = "Männlich";
	$YWerte[] = 200;
	$XWerte[] = "Weiblich";
	$YWerte[] = 50;
	$XWerte[] = "Beides";
	$YWerte[] = 125;
	$dia_title = "foobar";

	# X-Achsen-Vorgaben
	$XMin = 0;
	$XMax = count($XWerte);
	
	# Y-Achsen-Vorgaben
	$Tmp = $YWerte;
	sort($Tmp);
	$YMin = 0;
	rsort($Tmp);
	$YMax = $Tmp[0];

	
	// Allgemeine Diagrammlayout

	$Diagrammbreite = 250;
	$Diagrammhoehe = 250;
	$Diagrammtitel = $dia_title;


	// Ränder & Abstände
	$AbstandAussen = 3;
	$RandOben = 30;
	$RandLinks = 30;
	$RandUnten = 80;
	$RandRechts = 20;


	// Diagrammfarben
	$HintergrundfarbeR = 255;
	$HintergrundfarbeG = 255;
	$HintergrundfarbeB = 255;
	$HintergrundfarbeAuswertungsbereichR = 255;
	$HintergrundfarbeAuswertungsbereichG = 255;
	$HintergrundfarbeAuswertungsbereichB = 255;
	$TextfarbeR = 64;
	$TextfarbeG = 64;
	$TextfarbeB = 64;
	$AchsenfarbeR = 0;
	$AchsenfarbeG = 0;
	$AchsenfarbeB = 0;
	$BalkenfarbeR = 32;
	$BalkenfarbeG = 128;
	$BalkenfarbeB = 196;


	// Festlegung des Inhalttyps für den Webbrowser
	header("Content-type: image/png");
	$Grafik = imagecreatetruecolor($Diagrammbreite, $Diagrammhoehe);
	
	
	// Festlegung der verwendeten Farben
	$Textfarbe = imagecolorallocate($Grafik, $TextfarbeR, $TextfarbeG, $TextfarbeB);
	$Hintergrundfarbe = imagecolorallocate($Grafik, $HintergrundfarbeR, $HintergrundfarbeG, $HintergrundfarbeB);
	$HintergrundfarbeAuswertungsbereich = imagecolorallocate($Grafik, $HintergrundfarbeAuswertungsbereichR, $HintergrundfarbeAuswertungsbereichG, $HintergrundfarbeAuswertungsbereichB);
	$Achsenfarbe = imagecolorallocate($Grafik, $AchsenfarbeR, $AchsenfarbeG, $AchsenfarbeB);
	$Balkenfarbe = imagecolorallocate($Grafik, $BalkenfarbeR, $BalkenfarbeG, $BalkenfarbeB);


	// Allgemeinen Hintergrund und Auswertungsbereich einfärben
	imagefill($Grafik, 0, 0, $Hintergrundfarbe);
	imagefilledrectangle($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben, $Diagrammbreite-1-$AbstandAussen-$RandRechts, $Diagrammhoehe-1-$AbstandAussen-$RandUnten, $HintergrundfarbeAuswertungsbereich);


	// Allgemeine Berechnungen zur X- und Y-Achse
	if($YMax>10){
	   $YMaxAbstand = 10;
	}else{
	   $YMaxAbstand = $YMax;
	}
	$YAbstand = ($Diagrammhoehe-2*$AbstandAussen-$RandOben-$RandUnten-10)/$YMaxAbstand;
	$YWertHoehe = ($Diagrammhoehe-2*$AbstandAussen-$RandOben-$RandUnten-10)/$YMax;
	#$XAbstand = ($Diagrammbreite-2*$AbstandAussen-$RandRechts-$RandLinks-10)/$XMax;
	$XAbstand = 15;
	#$Balkendicke = ($XAbstand-4)/2;
	$Balkendicke = 5;


	// Hilfslinien einzeichnen
	imagesetstyle($Grafik, array($Achsenfarbe, $Achsenfarbe, IMG_COLOR_TRANSPARENT, IMG_COLOR_TRANSPARENT));
	for($i=0; $i<$YMaxAbstand; $i++){
		imageline($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben+10+($YAbstand*$i), $Diagrammbreite-$AbstandAussen-$RandRechts-1, $AbstandAussen+$RandOben+10+($YAbstand*$i), IMG_COLOR_STYLED);
	}


	// X-Achse einzeichnen
	imageline($Grafik, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Diagrammbreite-$AbstandAussen-$RandRechts, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	imageline($Grafik, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten-1, $Diagrammbreite-$AbstandAussen-$RandRechts, $Diagrammhoehe-$AbstandAussen-$RandUnten-1, $Achsenfarbe);
	for($i=0; $i<$XMax; $i++){
	   imageline($Grafik, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2+3), $Diagrammhoehe-$AbstandAussen-$RandUnten-2, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2+3), $Diagrammhoehe-$AbstandAussen-$RandUnten+2, $Achsenfarbe);
	   imagestringup($Grafik, 1, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2), $Diagrammhoehe-$AbstandAussen-$RandUnten+4+(imagefontwidth(1)*strlen($XWerte[$i])), $XWerte[$i], $Achsenfarbe);
	}


	// Y-Achse einzeichnen
	imageline($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	imageline($Grafik, $AbstandAussen+$RandLinks+1, $AbstandAussen+$RandOben, $AbstandAussen+$RandLinks+1, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	for($i=0; $i<=$YMaxAbstand; $i++){
	   imageline($Grafik, $AbstandAussen+$RandLinks-2, $AbstandAussen+$RandOben+10+($YAbstand*$i), $AbstandAussen+$RandLinks+2, $AbstandAussen+$RandOben+10+($YAbstand*$i), $Achsenfarbe);
	   if($YMax>10){
		  imagestring($Grafik, 1, $AbstandAussen+$RandLinks-4-(imagefontwidth(1)*strlen(round($YMax-(($YMax/10)*$i), 0))), $AbstandAussen+$RandOben+10-(imagefontheight(1)/2)+($YAbstand*$i), round($YMax-(($YMax/10)*$i), 0), $Achsenfarbe);
	   }else{
		  imagestring($Grafik, 1, $AbstandAussen+$RandLinks-4-(imagefontwidth(1)*strlen($YMax-$i)), $AbstandAussen+$RandOben+10-(imagefontheight(1)/2)+($YAbstand*$i), $YMax-$i, $Achsenfarbe);
	   }
	}


	//Werte einzeichnen
	
	for($i=0; $i<$XMax; $i++){
	   imagerectangle($Grafik, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)-$Balkendicke, $Diagrammhoehe-$AbstandAussen-$RandUnten-($YWertHoehe*$YWerte[$i]), $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)+$Balkendicke, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	   imagefilledrectangle($Grafik, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)-$Balkendicke+1, $Diagrammhoehe-$AbstandAussen-$RandUnten-($YWertHoehe*$YWerte[$i])+1, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)+$Balkendicke-1, $Diagrammhoehe-$AbstandAussen-$RandUnten-2, $Balkenfarbe);
	}


	//Diagrammtitel einzeichnen
	
	imagestring($Grafik, 5, $AbstandAussen+$RandLinks+($Diagrammbreite-(2*$AbstandAussen+$RandLinks+$RandRechts)-imagefontwidth(5)*strlen($Diagrammtitel))/2, $AbstandAussen, $Diagrammtitel, $Textfarbe);

	imagepng($Grafik);
	imagedestroy($Grafik);

?>

So sieht das ganze aus, wenn man die Datei image.php direkt im Browser aufruft:

Also habe ich 2 Moeglichkeiten:
- Direktes Einbinden
- Abspeichern und dann aufrufen

Ich hoffe mir kann jemand bei einer der Moeglichkeiten helfen.
Egal wie, hauptsache ich bekomme das Bild dann in meine Seite eingebunden.

Danke

paddz · 7. September 2006

hi,

also du kannst die image.php wie ein Bild mit dem <img > tag einbinden.

einfach als Quelle image.php angeben.

z.B.

HTML:

<img src="PFAD/zur/image.php">

MfG
paddz

Gumbo · 7. September 2006

Na, wie bindet man eine Grafik in ein HTML-Dokument ein? Als Quelle gibst du einfach das PHP-Skript an.

Suchfunktion · 7. September 2006

Argh.. Vorfuereffekt -.-
Gestern gings noch nicht *grins*
(Hatte nen fehler uebersehen)

Gut, also Danke erstmal

Das geht jetzt.

Aber:
Da die Werte aus dynamischen Arrays ausgelesen werden ($XWerte[] und $YWerte[]), muss ich diese irgendwie an die Grafik-Datei uebergeben.
Habe es schon mit Sessions versucht, aber dann wird die Grafik garnicht mehr angezeigt, bzw. nicht erzeugt.

Hauptseite:

PHP:

<?php
		$XWerte[] = "Männlich";
		$YWerte[] = 200;
		$XWerte[] = "Weiblich";
		$YWerte[] = 50;
		$XWerte[] = "Beides";
		$YWerte[] = 125;
		$_SESSION["XWerte"]=$XWerte;
		$_SESSION["YWerte"]=$YWerte;
		echo '<img src="demo_img.php">';
?>

image.php:

PHP:

<?php
	session_start();

	// Geschlecht Diagramm
	$XWerte = $_SESSION["XWerte"];
	$YWerte = $_SESSION["YWerte"];

...

?>

Hat jemand eine bessere Idee (bzw. sieht jemand den Fehler) wie ich die Werte in die Grafik-Datei bekomme?

Thx

Dr Dau · 7. September 2006

Hallo!

Übergebe die Werte doch einfach per URL:

HTML:

<img src="image.php?m=200&w=50&b=125&t=foobar">

Und im Image-Script:

PHP:

    // Geschlecht Diagramm 
    $XWerte[] = "Männlich"; 
    $YWerte[] = $_GET['m']; 
    $XWerte[] = "Weiblich"; 
    $YWerte[] = $_GET['w']; 
    $XWerte[] = "Beides"; 
    $YWerte[] = $_GET['b']; 
    $dia_title = $_GET['t'];

Gruss Dr Dau

Suchfunktion · 8. September 2006

Gab es nicht eine Zeichenbegrenzung bei der Uebergabe ueber die URL?

Naja, also ich habe es jetzt so zusammengebastelt, dass eine Grafik erstellt, abgespeichert und dann eingebunden wird

Geht gut ab

Hier das Script:
Ausgabeseite:

PHP:

		$XWerte[] = "Männlich";
		$YWerte[] = $customers_gender_male;
		$XWerte[] = "Weiblich";
		$YWerte[] = $customers_gender_female;		
		
		$dia_title = "Geschlecht"; #// wurde deaktiviert in der image.php
		$image_name = "Geschlecht";
		include('image.php');
		
		$XWerte = "";
		$YWerte = "";

		echo "<img src=\"demo_img/$image_name.png\">";

image.php:

PHP:

<?php

	# X-Achsen-Vorgaben
	$XMin = 0;
	$XMax = count($XWerte);
	
	# Y-Achsen-Vorgaben
	$Tmp = $YWerte;
	sort($Tmp);
	$YMin = 0;
	rsort($Tmp);
	$YMax = $Tmp[0];

	
	// Allgemeine Diagrammlayout

	$Diagrammbreite = 55 + ($XMax*15);
	#$Diagrammbreite = 250;
	$Diagrammhoehe = 250;
	$Diagrammtitel = $dia_title;


	// Ränder & Abstände
	$AbstandAussen = 3;
	$RandOben = 30;
	$RandLinks = 30;
	$RandUnten = 80;
	$RandRechts = 20;


	// Diagrammfarben
	$HintergrundfarbeR = 255;
	$HintergrundfarbeG = 255;
	$HintergrundfarbeB = 255;
	$HintergrundfarbeAuswertungsbereichR = 255;
	$HintergrundfarbeAuswertungsbereichG = 255;
	$HintergrundfarbeAuswertungsbereichB = 255;
	$TextfarbeR = 64;
	$TextfarbeG = 64;
	$TextfarbeB = 64;
	$AchsenfarbeR = 0;
	$AchsenfarbeG = 0;
	$AchsenfarbeB = 0;
	$BalkenfarbeR = 32;
	$BalkenfarbeG = 128;
	$BalkenfarbeB = 196;


	// Festlegung des Inhalttyps für den Webbrowser
	#header("Content-type: image/png");
	$Grafik = imagecreatetruecolor($Diagrammbreite, $Diagrammhoehe);
	
	
	// Festlegung der verwendeten Farben
	$Textfarbe = imagecolorallocate($Grafik, $TextfarbeR, $TextfarbeG, $TextfarbeB);
	$Hintergrundfarbe = imagecolorallocate($Grafik, $HintergrundfarbeR, $HintergrundfarbeG, $HintergrundfarbeB);
	$HintergrundfarbeAuswertungsbereich = imagecolorallocate($Grafik, $HintergrundfarbeAuswertungsbereichR, $HintergrundfarbeAuswertungsbereichG, $HintergrundfarbeAuswertungsbereichB);
	$Achsenfarbe = imagecolorallocate($Grafik, $AchsenfarbeR, $AchsenfarbeG, $AchsenfarbeB);
	$Balkenfarbe = imagecolorallocate($Grafik, $BalkenfarbeR, $BalkenfarbeG, $BalkenfarbeB);


	// Allgemeinen Hintergrund und Auswertungsbereich einfärben
	imagefill($Grafik, 0, 0, $Hintergrundfarbe);
	imagefilledrectangle($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben, $Diagrammbreite-1-$AbstandAussen-$RandRechts, $Diagrammhoehe-1-$AbstandAussen-$RandUnten, $HintergrundfarbeAuswertungsbereich);


	// Allgemeine Berechnungen zur X- und Y-Achse
	if($YMax>10){
	   $YMaxAbstand = 10;
	}else{
	   $YMaxAbstand = $YMax;
	}
	$YAbstand = ($Diagrammhoehe-2*$AbstandAussen-$RandOben-$RandUnten-10)/$YMaxAbstand;
	$YWertHoehe = ($Diagrammhoehe-2*$AbstandAussen-$RandOben-$RandUnten-10)/$YMax;
	#$XAbstand = ($Diagrammbreite-2*$AbstandAussen-$RandRechts-$RandLinks-10)/$XMax;
	$XAbstand = 15;
	#$Balkendicke = ($XAbstand-4)/2;
	$Balkendicke = 5;


	// Hilfslinien einzeichnen
	imagesetstyle($Grafik, array($Achsenfarbe, $Achsenfarbe, IMG_COLOR_TRANSPARENT, IMG_COLOR_TRANSPARENT));
	for($i=0; $i<$YMaxAbstand; $i++){
		imageline($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben+10+($YAbstand*$i), $Diagrammbreite-$AbstandAussen-$RandRechts-1, $AbstandAussen+$RandOben+10+($YAbstand*$i), IMG_COLOR_STYLED);
	}


	// X-Achse einzeichnen
	imageline($Grafik, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Diagrammbreite-$AbstandAussen-$RandRechts, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	imageline($Grafik, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten-1, $Diagrammbreite-$AbstandAussen-$RandRechts, $Diagrammhoehe-$AbstandAussen-$RandUnten-1, $Achsenfarbe);
	for($i=0; $i<$XMax; $i++){
	   imageline($Grafik, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2+3), $Diagrammhoehe-$AbstandAussen-$RandUnten-2, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2+3), $Diagrammhoehe-$AbstandAussen-$RandUnten+2, $Achsenfarbe);
	   imagestringup($Grafik, 1, $AbstandAussen+$RandLinks+($XAbstand*$i)+($XAbstand/2), $Diagrammhoehe-$AbstandAussen-$RandUnten+4+(imagefontwidth(1)*strlen($XWerte[$i])), $XWerte[$i], $Achsenfarbe);
	}


	// Y-Achse einzeichnen
	imageline($Grafik, $AbstandAussen+$RandLinks, $AbstandAussen+$RandOben, $AbstandAussen+$RandLinks, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	imageline($Grafik, $AbstandAussen+$RandLinks+1, $AbstandAussen+$RandOben, $AbstandAussen+$RandLinks+1, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	for($i=0; $i<=$YMaxAbstand; $i++){
	   imageline($Grafik, $AbstandAussen+$RandLinks-2, $AbstandAussen+$RandOben+10+($YAbstand*$i), $AbstandAussen+$RandLinks+2, $AbstandAussen+$RandOben+10+($YAbstand*$i), $Achsenfarbe);
	   if($YMax>10){
		  imagestring($Grafik, 1, $AbstandAussen+$RandLinks-4-(imagefontwidth(1)*strlen(round($YMax-(($YMax/10)*$i), 0))), $AbstandAussen+$RandOben+10-(imagefontheight(1)/2)+($YAbstand*$i), round($YMax-(($YMax/10)*$i), 0), $Achsenfarbe);
	   }else{
		  imagestring($Grafik, 1, $AbstandAussen+$RandLinks-4-(imagefontwidth(1)*strlen($YMax-$i)), $AbstandAussen+$RandOben+10-(imagefontheight(1)/2)+($YAbstand*$i), $YMax-$i, $Achsenfarbe);
	   }
	}


	//Werte einzeichnen
	
	for($i=0; $i<$XMax; $i++){
	   imagerectangle($Grafik, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)-$Balkendicke, $Diagrammhoehe-$AbstandAussen-$RandUnten-($YWertHoehe*$YWerte[$i]), $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)+$Balkendicke, $Diagrammhoehe-$AbstandAussen-$RandUnten, $Achsenfarbe);
	   imagefilledrectangle($Grafik, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)-$Balkendicke+1, $Diagrammhoehe-$AbstandAussen-$RandUnten-($YWertHoehe*$YWerte[$i])+1, $AbstandAussen+$RandLinks+($XAbstand*($i+1))-($XAbstand/2-3)+$Balkendicke-1, $Diagrammhoehe-$AbstandAussen-$RandUnten-2, $Balkenfarbe);
	}


	//Diagrammtitel einzeichnen
	
	#imagestring($Grafik, 5, $AbstandAussen+$RandLinks+($Diagrammbreite-(2*$AbstandAussen+$RandLinks+$RandRechts)-imagefontwidth(5)*strlen($Diagrammtitel))/2, $AbstandAussen, $Diagrammtitel, $Textfarbe);

	imagepng($Grafik, "demo_img/$image_name.png");
	imagedestroy($Grafik);

?>

Ist sogar noch besser geworden, als das Original-Script im Tutorial,
da sich die Diagrammbreite jetzt automatisch der Anzahl der X-Werte anpasst und die Balken auch immer gleichmaessig breit sind.

Nochmal danke fuer eure Hilfe

✔ PHP-Diagramm einbinden?

Suchfunktion

Erfahrenes Mitglied

paddz

Mitglied

Gumbo

Erfahrenes Mitglied

Suchfunktion

Erfahrenes Mitglied

Dr Dau

ich wisch hier durch

Suchfunktion

Erfahrenes Mitglied

Neue Beiträge