Ankündigung

Einklappen
Keine Ankündigung bisher.

Mit PHP dynamisch Bilder erstellen

Einklappen
Dieses Thema ist geschlossen.
X
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Mit PHP dynamisch Bilder erstellen

    Diese Tutorial wurde von LLCoolDannY geschrieben.

    ------------------------------------------------

    Hi, in diesem Tutorial, seht ihr wie man mit PHP dynamische Bilder erstellen kann.

    Fangen wir mit einem einfachen Rechteck an (Erklärung im Code mit PHP-Kommentaren):

    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen
    $width 500# Später die Breite des Rechtecks
    $height 200# Später die Höhe des Rechtecks
    $img ImageCreate($width$height); # Hier wird das Bild einer Variable zu gewiesen
    $black ImageColorAllocate($img000); # Hier wird der Variable $black die Farbe schwarz zugewiesen
    # Die drei nullen bestehen aus den RGB-Parametern. 255, 0, 0 wäre z.B. rot. ($img muss am Anfang stehen)
    ImageFill($img00$black); # Hier wird mit ImageFill() das Bild gefüllt an den Koordinaten 0 und 0 mit der Variable $black, also Schwarz
    ImagePNG($img); # Hier wird das Bild PNG zugewiesen
    ?>
    Ich denke, hierfür brauche ich kein Bild zu zeigen, da es nur eine schwarze Fläche 500x200px ist.
    -------------------------------------------------------------------------------------------------

    Nun beschriften wir das Rechteck (z.B. für eine dynamische Signatur):
    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen

    ##################################################
    $width 100// Später die Breite des Rechtecks
    $height 50// Später die Höhe des Rechtecks
    $img ImageCreate($width$height); # Hier wird das Bild einer Variable zu gewiesen
    ##################################################


    ##################################################
    $black ImageColorAllocate($img000); # Hier wird der Variable $black die Farbe schwarz zugewiesen
    $white ImageColorAllocate($img255255255); # Hier wird der Variable $white die Farbe weiß zugewiesen
    # Die drei nullen bestehen aus den RGB-Parametern. 255, 0, 0 wäre z.B. rot. ($img muss am Anfang stehen)
    ##################################################


    ##################################################
    ImageFill($img00$black); # Hier wird mit ImageFill() das Bild gefüllt an den Koordinaten 0 und 0 mit der Variable $black, also Schwarz
    ImageString($img22620"Der Text"$white);
    # Die 2 steht für die GD-Lib interne Schriftart (es gibt insgesamt 5, also probierts aus).
    # Die 26 steht für die Position von Links, also 26px von Links entfernt.
    # Die 20 steht für die Postion von Oben, also 20px von oben entfernt.
    # Der Text, ist der, der später im Bild erscheinen soll.
    # $white steht für die Farbe die der Text haben soll.
    ###################################################

    ImagePNG($img); # Hier wird das Bild PNG zugewiesen
    ImageDestroy($img# Hier wird der Speicherplatz für andere Sachen geereinigt
    ?>
    Hierfür brauche ich wohl auch kein Bild
    ----------------------------------------------------------------------

    So nun kann man das Bild im Bild noch mal mit anderen Farben einfüllen.
    Ich hab mal eine Deutschlandfahne gemacht
    So hier ist der Code dafür:

    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen

    ##################################################
    $width 300# Später die Breite des Rechtecks
    $height 300# Später die Höhe des Rechtecks
    $img ImageCreate($width$height); # Hier wird das Bild einer Variable zu gewiesen
    ##################################################

    ##################################################
    $black ImageColorAllocate($img000); # Hier wird die Farbe schwarz einer Variable zugewiesen
    $red ImageColorAllocate($img25500); # Hier wird die Farbe rot einer Variable zugewiesen
    $yellow ImageColorAllocate($img2552550); # Hier wird die Farbe gelb einer Variable zugewiesen
    ##################################################


    ##################################################
    ImageFill($img00$yellow); # Erst wird das Bild mit gelb gefüllt.
    ImageFilledRectangle($img00300100$black); # Mit ImageFillRectangle wird ein weiter Bereich des Bildes mit schwarz gefüllt
    # Die 1. 0 ist die Entfernung in px von Links.
    # Die 2. 0 ist die Entfernung in px von Oben.
    # Die 300 ist die Breite der Farbe.
    # Die 100 ist die Höhe der Farbe.
    ImageFilledRectangle($img0101300200$red);
    # Hier die gleichen Sachen wie bei der Schwarzfüllung, nur mit anderen Koordinaten und anderer Farbe.

    ##################################################
    ImagePNG($img);
    ImageDestroy($img# Hier wird der Speicherplatz für andere Sachen geereinigt
    ?>
    So siehts dann aus:

    ----------------------------------------------------------------------

    So jetzt kommen wir zu Kreisen, Ellipsen und Linien:

    Kreise, Halbkreise, Ellipsen:
    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen

    ##################################################
    $width 100// Später die Breite des Rechtecks
    $height 100// Später die Höhe des Rechtecks
    $img ImageCreate($width$height); # Hier wird das Bild einer Variable zu gewiesen
    ##################################################

    ##################################################
    $red ImageColorAllocate($img25500); # Hier wird der Variable $red die Farbe rot zugewiesen
    $white ImageColorAllocate($img255255255); # Hier wird der Variable $white die Farbe weiß zugewiesen
    ##################################################
    ImageFill($img00$white); # Erst wird das Bild mit weiß gefüllt.

    ImageArc($img505090201180$red); # Jetzt wird ein Kreis gezogen
    # Der erste Parameter 50 steht für die Entfernung in px von rechts
    # Der zweite Parameter 50 steht für die Entfernung in px von oben
    # Der dritte Parameter 90 steht für die Größe des Kreises (oder der Ellipse) in der Breite
    # Der vierte Parameter 20 steht für die Größe des Kreises (oder der Ellipse) in der Höhe
    # Der fünfte Parameter 1 steht für den Startwinkel
    # Der sechste Parameter 180 steht für den Endwinkel des Kreises (bzw. der Ellipse)
    ######################################################

    ImagePNG($img); # Hier wird das Bild PNG zugewiesen
    ImageDestroy($img# Hier wird der Speicherplatz für andere Sachen geereinigt
    ?>
    Linien, Gestrichtelte Linien:

    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen

    ##################################################
    $width 250# Später die Breite des Rechtecks
    $height 250# Später die Höhe des Rechtecks
    $img ImageCreate($width$height); # Hier wird das Bild einer Variable zu gewiesen
    ##################################################

    ##################################################
    $white ImageColorAllocate($img255255255); # Hier wird die Farbe weiß einer Variable zugewiesen
    $black ImageColorAllocate($img000); # Hier wird die Farbe schwarz einer Variable zugewiesen
    ##################################################

    ImageFill ($img00$white); # Das Bild wird mit weiß gefüllt.

    ImageLine($img1125250125$black); # Mit ImageLine wir eine Linie gezeichnet
    #
    # Die 1 steht für den Abstand in px von links
    # Die 1. 125 steht für den Abstand in px von Oben vom linken Punkt der Strecke
    # Die 250 steht für den Abstand in px von rechts
    # Die 2. 125 steht für den Abstand in px von Oben vom rechten Punkt der Strecke
    #
    # !!! WICHTIG: Für geschtrichelte Lininen einfach den Befehl 'ImageDashedLine()' benutzen
    # Die Parameter sind gleich wie bei 'ImageLine' !!!
    #
    #
    ##################################################

    ##################################################
    ImagePNG($img); # Hier wird das Bild PNG zugewiesen
    ImageDestroy($img# Hier wird der Speicherplatz für andere Sachen geereinigt
    ?>
    ----------------------------------------------------------------------

    Jetzt kommen wir zu einem sehr interessanten Teil vom Tutorial:

    Mit existierenden Bildern z.B. eine dynamische Signatur bilden:

    PHP-Code:
    <?php
    Header
    ("Content-Type: image/png");
    # Hier wird der Header gesendet, der später die Bilder "rendert" ausser png kann auch jpeg dastehen

    ##################################################
    $width 100// Später die Breite des Rechtecks
    $height 100// Später die Höhe des Rechtecks
    $img ImageCreateFromJPEG('g.jpg'); # Hier wird das Bild einer von einem Vorhandenen Bild benutzt (hier: g.jpg)
    #
    # Seit Version 1.6 der GD-Library ist .gif abgeschaltet also:
    #
    #---------------------------------------------------
    # Zuhause von der GD-Lib: [url]http://www.boutell.com/gd/[/url]
    #---------------------------------------------------
    #
    # Wenn ihr die GD-Library 2.0 habt immer .jpg oder .png aber kein .gif benutzen!

    # So kann man GD-Library einstellen:

    # 1. Öffnet im Windows-Ordner die php.ini z.B. C:\Windows\php.ini
    #
    # 2. Jetzt sucht (STR+F) nach ';Windows Extensions' (ohne den Hochkommata)
    #
    # 3. Dann schreibt 'extension=php_gd2.dll' unter 'extension=php_gd.dll'
    #
    # 4. Jetzt macht ein ; vor 'extension=php_gd.dll'. Also aus 'extension=php_gd.dll' mach ';extension=php_gd.dll'
    #
    # 5. Oder wenn ihr GD-Lib 1.X wollt, dann macht es umgekehrt
    ##################################################

    $black ImageColorAllocate($img000); # Farbe schwarz mit $black festlegen

    $font_height ImageFontHeight(3); # Hier wird die Schrifthöhe mit 3 belegt (hier könnt ihr mit den Werten rumprobieren)

    $font_width ImageFontWidth(3); # Hier wird die Schriftbreite mit 3 belegt (hier könnt ihr mit den Werten rumprobieren)

    $image_height ImageSY($img); # Hier wird in einer Variable die Höhe des Bildes (hier g.jpg) gespeichert

    $image_width ImageSX($img); # Hier wird in einer Variable die Breite des Bildes (hier g.jpg) gespeichert

    $text 'Mein Name ist LLCoolDannY!'# Hier ist der Text, der später im Bild stehen soll

    $length $font_width*strlen($text); # Hier wird die Schriftbreite an das Bild angepasst

    # Hier kriegt man durch Teilungen die Mitte des Bildes heraus #

    $image_center_x = ($image_width/2)-($length/2);
    $image_center_y = ($image_height/2)-($font_height/2);

    ###############################################################

    ImageString($img3$image_center_x$image_center_y$text$black);
    /**
    * Die 3 nach der Variable $img steht für die GD-Lib interne Schriftart diese geht von 1-5 (also ausprobieren)

    * --------------------------------------------------------------------------------------------------------------------------------
    * Mit $image_center_x und $image_center_y wurde die Mitte herausgefunden und nun angewandt. (Dort können auch eigene Zahlen stehen)
    * Beispiel:

    * ImageString($img, 3, 200, 150, 'Das ist ein Testtext', $black);
    *
    * Hier ist der String (Zeichenkette, also der Text) 200px von oben und 150px von links vom Bildrand entfernt
    *
    * --------------------------------------------------------------------------------------------------------------------------------
    *
    */

    ImagePNG($img); # Hier wird das Bild PNG zugewiesen
    ImageDestroy($img# Hier wird der Speicherplatz für andere Sachen geereinigt
    ?>
    Das Ergebniss könnte dann so aussehen:
    Vorher:


    Nachher:



    ----------------------------------------------------------------
    So ich denke, alle hauptsächlichen Funktionen sind drin.

    MfG, LLCoolDannY

    Zusatz:
    Hier sind alle (mir Bekannten) Verweise zu Image*()-Funktionen:
    -----------------------------------------------------------
    imagechar
    imagecharup
    imagecolorallocate
    imagecolorat
    imagecolorclosest
    imagecolorexact
    imagecolorresolve
    imagecolorset
    imagecolorsforindex
    imagecolorstotal
    imagecolortransparent
    imagecopyresized
    imagecreate
    imagecreatefromgif
    imagedashedline
    imagedestroy
    imagefill
    imagefilledpolygon
    imagefilledrectangle
    imagefilltoborder
    imagefontheight
    imagefontwidth
    imagegif
    imageinterlace
    imageline
    imageloadfont
    imagepolygon
    imagepsbbox
    imagepsencodefont
    imagepsfreefont
    imagepsloadfont
    imagepstext
    imagerectangle
    imagesetpixel
    imagestring
    imagestringup
    imagesx
    imagesy
    imagettfbbox
    imagettftext
    -----------------------------------------------------------
    _________________
    [L][L][C][O][O][L][D][A][N][N][Y]


  • #2
    super .. werde ich direkt mal ausprobieren

    direktlink: http://de3.php.net/manual/de/ref.image.php


    ---
    edit:

    die diskussion über das richtige kommentieren ist hier fehl am platze.
    ein zitat aus dem moderatoren-forum, in dem auch über diesen thread hier gesprochen wurde:

    Wem die Notation der Kommentare nicht gefällt, der kann sie ja ersetzen.
    in diesem sinne.

    grüße ben
    [b][url=http://www.benjamin-klaile.de]privater Blog[/url][/b]

    Kommentar


    • #3
      Wer die gdlib2 zur Verfügung hat, sollte anstatt imagecreate() imagecreatetruecolors() benutzen. Damit bekommt man wesentlich bessere Ergebnisse. Die Funktion funktioniert nicht für GIF-Bilder (und der LZW ist ja nun wieder frei und bestimmt bald wieder in der gdlib drinnen).

      Basti

      Kommentar


      • #4
        Ich will nur noch anmerken, dass die Funktion die bbastix meint imagecreatetruecolor() heißt - ohne s hinten.


        Und weil es in LLcooldannys Aufzählung auch fehlt:
        Statt imagecopyresized empfiehlt es sich imagecopyresampled() zu verwenden (bei ausreichend aktueller gdlib) - so erzielt man bessere Ergebnisse....


        mfG
        werbegeschenk
        Create your own quiz show.

        Kommentar


        • #5
          Ist es möglich, beim Hinzufügen eines Textes einen Zeilenumbruch hinzuzufügen?

          Gruß

          Kommentar


          • #6
            Nein. so weit ich weis, kann keine der Grafik funktionen einen Zeilenumbruch
            verarbeiten. will heissen, zwei zeilen = zwei funktionsaufrufe.

            Kommentar


            • #7
              Hi Leute!!

              Erstmal danke für die geile Anleitung. Hat mir wirklich weitergeholfen. Denn ich programmiere zur Zeit an einem kleinen Spiel

              Und deshalb habe ich eine wichtige frage, ich hoffe ihr könnt mir helfen.

              Und zwar ist es in html ja z.b. möglich bestimmte Flächen von Bildern zu verlinken dazu hat man ja

              <area shape="poly" coords="12,3,54,15,75,32,65,52,33,49,10,31,6,8" href="http://gaming-board.com" target="_blank">

              zum Beispiel.

              Ist es so ähnlich auch möglich bestimmte Flächen von Bildern mit einer Farbe auszufüllen, oder an einer bestimmten Stelle ein anderes Bild "über" diese grundgrafik zu legen.

              Vielen vielen dank schonmal.

              Kommentar


              • #8
                sicher ist es möglich. du musst das grundbild halt nur öffnen, und dann
                kannste mit den ganzen funktionen rumspielen .. kreise, rechtecke, polys
                drüber legen, als transparente objekte, in vollfarbe .. was das herz begehrt.

                Kommentar


                • #9
                  also müsste ich prakisch gesehen das objekt (in dem fall ein auto) mit den bestimmten Formen ausfüllen, bis die fläche halt gedeckt ist?

                  Also so eine einfache möglichkeit wie mti den spots in html (also wo ich ich eckkoordinaten nur angebe gibt's nicht?

                  PS: Mit welcher Funktion kann ich transparente Objekte drüberlegen? Hab gerade mal geschaut oben in der liste, aber ncihts richtiges gefunden?!?

                  Schonmal vielen dank.

                  //EDIT:

                  hab gerade hier die Funktion: imagefill gefunden.

                  Dort steht, dass sie das Bild füllen kann von einer X bis Y Variable ... dann muss das ja doch irgendwie auch gehen, dass sie einen bildabschnitt oder farbe ersetzt ?



                  //EDIT 2: ich habs gefunden! imagefilltoborder in einem bestimmten Rahmen fläche füllen!


                  Geeeeil. Danke leute!!!

                  cu, Neo

                  Kommentar


                  • #10
                    Hi

                    cooler Threa !! ist echt hilfreich.

                    Kennt jemand ne funktion mit der ich ein bild über das grundbild kopieren kann. Hab nix gefunden.

                    Danke schonmal im voraus.

                    Kommentar


                    • #11
                      Zitat von Kenshin
                      Kennt jemand ne funktion mit der ich ein bild über das grundbild kopieren kann. Hab nix gefunden.
                      Noch mal suchen. "Das alles und noch viel mehr..." findest Du im Handbuch unter
                      http://www.php.net/manual/de/ref.image.php

                      Kommentar


                      • #12
                        Zitat von meikel
                        Zitat von Kenshin
                        Kennt jemand ne funktion mit der ich ein bild über das grundbild kopieren kann. Hab nix gefunden.
                        Noch mal suchen. "Das alles und noch viel mehr..." findest Du im Handbuch unter
                        http://www.php.net/manual/de/ref.image.php
                        da hatte ich auch schon geschaut, aber nid gefunden mit denen ich ein zweites bild laden kann ohne das erste wieder zu löschen.

                        Kommentar


                        • #13
                          Zitat von Kenshin
                          da hatte ich auch schon geschaut, aber nid gefunden mit denen ich ein zweites bild laden kann ohne das erste wieder zu löschen.
                          Es muss ja nicht immer $img heissen ...*?!*

                          Kommentar


                          • #14
                            ja aber wie geb ich das bild dann wieder aus ???

                            Kommentar


                            • #15
                              google nutzen und sich freuen:
                              http://www.php4u.net/index.php?main=...psel&source=63
                              Aufstrebend, kompetent und [b]werbefrei[/b].
                              :arrow: [b][url=http://www.developers-guide.net]www.developers-guide.net[/url][/b]

                              Kommentar

                              Lädt...
                              X