Allgemeine Informationen zu Elektronik, Platinen, Programmierung, PCs und mehr...

von Harry Milatz aus Dortmund am 6. November 2014 | 4 Kommentare | aktualisiert am 7. November 2020 | 7100 mal gelesen
46 mal als PDF heruntergeladen

Bilder skalieren mit PHP

So leicht lassen sich Bilder mit PHP skalieren und neu abspeichern

Bilder ohne Grafikprogramm in einer anderen Größe abspeichern

Manchmal kommt es vor, dass man ein bereits online gestelltes Bild oder eine Grafik in einer anderen Größe braucht.
Man kann natürlich das Bild mit HTML oder auch CSS skalieren. Oder man nutzt PHP und nutzt die Funktion getimagesize(), um das für einen zu erledigen. Meistens geht das schneller als mit dem Grafikprogramm und das neue Bild muss nicht extra hochgeladen werden.
Du kannst übrigens direkt auf dieser Seite weiter unten das Skalieren von Bildern ausprobieren und dann unter dem angegebenen Link das Bild anschauen und herunterladen.

Um direkt zum Formular zur Bildskalierung zu kommen, einfach nach unten scrollen oder hier klicken.

PHP kann mit getimagesize() alle Eigenschaften eines Bildes auslesen. Diese Eigenschaften werden in der Variabel $image_attributes als Array gespeichert.
Der erste Wert enthält die Breite, der zweite Wert enthält die Höhe und der dritte Wert enthält den Dateitypen. Der vierte Wert enthält die korrekte Zeichenkette im Format 'heigt=xxx width=xxx', um das im IMG-Tag von HTML zu benutzen. Das brauchen wir hier aber nicht.

Hier mal die komplette Auflistung:
$image_attributes[0] => Breite des Bildes in Pixeln
$image_attributes[1] => Höhe des Bildes in Pixeln
$image_attributes[2] => Enthält einen numerischen Wert für den Bildtyp. (siehe Konstanten)
$image_attributes[3] => Enthält einen String für die Verwendung in HTML, leider für CSS nicht verwendbar.
$image_attributes[‘mime‘] => Enthält den MIME-Type des Bildes laut RFC.
$image_attributes[‘channels‘] => Enthält die Anzahl der Farbkanäle (also z.B. wieviel Bytes ein Pixel beansprucht).
$image_attributes[‘bits‘] => Enthält die Anzahl der Bits pro Farbkanal.

Aktuell können mit diesem Script JPG, GIF und PNG neu skaliert werden. Das wird ab Zeile 41 unterschieden, denn dort wird die neue Bilddatei erzeugt und gespeichert.
Wenn jemand Lust hat, das Script um die anderen Bilddateitypen zu erweitern, bitte ich um entsprechende Kommentare :-)
Folgende Dateitypen(Konstanten) gibt es:
GIF = 1
JPG = 2
PNG = 3
SWF = 4 -> kein Bilddateityp !!
PSD = 5
BMP = 6
TIF = 7 (intel byte order)
TIF = 8 (motorola byte order)
JPC = 9 -> JPEG2000
JP2 = 10
JPX = 11
JB2 = 12 -> kein Bilddateityp !!
SWC = 13 -> kein Bilddateityp !!
AIFF = 14
WBMP = 15
XBM = 16
ICO = 17

Natürlich ist nicht jeder Dateityp für eine Skalierung geeignet ;-)

Bei anderen Dateitypen als den ersten drei, bricht das Script in Zeile 73 ab.

Bild skalieren – die Berechnungen:

Mit $image_aspectratio = $image_width_old / $image_height_old wird dann das Seitenverhältnis berechnet, um mit diesem Wert nachher die neue Größe korrekt berechnen zu können.

Ab Zeile 22 wird je nach gewähltem $scale_mode die neue Breite und Höhe des skalierten Bildes berechnet.

Bedeutung von $scale_mode= :

-1: $image_dimension wird als neue Breite des Bildes aufgefasst.
Die Höhe wird so angepasst, dass das Seitenverhältnis des Bildes erhalten bleibt.

-2: $image_dimension wird als neue Höhe des Bildes aufgefasst.
Die Breite wird so angepasst, dass das Seitenverhältnis des Bildes erhalten bleibt.

0: $image_dimension wird als neue längste Seite des Bildes aufgefasst.
Die andere Seite wird entsprechend verkleinert, damit das Seitenverhältnis des Bildes erhalten bleibt.
Ideal für Thumbnails, die quadratisch sind.

1: $image_dimension wird als neue kürzeste Seite des Bildes aufgefasst.
Die andere Seite wird entsprechend vergrößert, damit das Seitenverhältnis des Bildes erhalten bleibt.
Ideal, wenn das Bild eine Mindestgröße nicht unterschreiten soll.

Der Aufruf der Funktion:

resizeImage ($filepath_old, $filepath_new, $image_dimension, $scale_mode)

Also zb:
$filepath_old = "../catalog/bild.jpg";
$filepath_new = "../catalog/bild_neu.jpg";
resizeImage ($filepath_old, $filepath_new, 300, $scale_mode = -1);

Hier das komplette Script, um Bilder zu skalieren:

<?php
$filepath_ori = $_POST['filepath_ori'];
$breite = $_POST['breite'];
$datei = $_POST['datei'];
$endung = $_POST['endung'];
$skalierung = $_POST['skalierung'];
$send = $_POST['send'];
//Hier folgt die Funktion:
 function resizeImage ($filepath_ori, $filepath_new, $image_dimension, $scale_mode = 0) {
  if ( !(file_exists ($filepath_ori) ) ) return false;

  $image_attributes = getimagesize ($filepath_ori);
  $image_width_old = $image_attributes[0];
  $image_height_old = $image_attributes[1];
  $image_filetype = $image_attributes[2];

  if ($image_width_old <= 0 || $image_height_old <= 0) return false;
  $image_aspectratio = $image_width_old / $image_height_old;

  if ($scale_mode == 0) {
   $scale_mode = ($image_aspectratio > 1 ? -1 : -2);
  } elseif ($scale_mode == 1) {
   $scale_mode = ($image_aspectratio > 1 ? -2 : -1);
  }

  if ($scale_mode == -1) {
   $image_width_new = $image_dimension;
   $image_height_new = round ($image_dimension / $image_aspectratio);
  } elseif ($scale_mode == -2) {
   $image_height_new = $image_dimension;
   $image_width_new = round ($image_dimension * $image_aspectratio);
  } else {
   return false;
  }

  switch ($image_filetype) {
   case 1:
    $image_old = imagecreatefromgif ($filepath_ori);
    $image_new = imagecreate ($image_width_new, $image_height_new);
    imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);
    imagegif ($image_new, $filepath_new);
    break;
 
   case 2:
    $image_old = imagecreatefromjpeg ($filepath_ori);
    $image_new = imagecreatetruecolor ($image_width_new, $image_height_new);
    imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);
    imagejpeg ($image_new, $filepath_new);
    break;

   case 3:
    $image_old = imagecreatefrompng ($filepath_ori);
    $image_colordepth = imagecolorstotal ($image_old);

    if ($image_colordepth == 0 || $image_colordepth > 255) {
     $image_new = imagecreatetruecolor ($image_width_new, $image_height_new);
    } else {
     $image_new = imagecreate ($image_width_new, $image_height_new);
    }

    imagealphablending ($image_new, false);
    imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);
    imagesavealpha ($image_new, true);
    imagepng ($image_new, $filepath_new);
    break;

   default:
    return false;
  }

  imagedestroy ($image_old);
  imagedestroy ($image_new);
  return true;
 }
$base_url = "http://" . $_SERVER['SERVER_NAME'] . "/";
//Bei manchen Servern ist es nötig den absoluten Pfad anzugeben:
$dir = "/var/www/virtual/xxxxx.de/xxxxxx.de/htdocs/wp-content/uploads/neu/";
//Man sollte aber auch probieren ob ein relativer Pfad reicht:
#$dir = "./wp-content/uploads/neu/";
?>
//Hier kommt das Formular zur Eingabe:
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<form action="<?php echo $base_url; ?>programmierung/codeschnipsel/bilder-skalieren-mit-php/" method="post">
URL zum Originalbild*: <input type="text" name="filepath_ori" value=""><br>
*komplette URL, also zb: https://www.all4hardware4u.de/wp-content/uploads/2013/11/bild.jpg
<br><br>
neue Breite in PX: <input type="text" name="breite" value="<?php echo $breite; ?>"><br><br>
neuer Dateiname: <input type="text" name="datei" value="<?php echo $datei; ?>"><br><br>
neuer Dateityp**: <select name="endung">
<option value="">-nicht ändern</option>
<option value="1" <?php if($endung=="1") {echo "selected";}?>>.gif</option>
<option value="2" <?php if($endung=="2") {echo "selected";}?>>.jpg</option>
<option value="3" <?php if($endung=="3") {echo "selected";}?>>.png</option>
<option value="4" <?php if($endung=="4") {echo "selected";}?>>.swf</option>
<option value="6" <?php if($endung=="6") {echo "selected";}?>>.bmp</option>
<option value="17" <?php if($endung=="17") {echo "selected";}?>>.ico</option>
</select><br>
**Achtung! Das Ändern der Dateiänderung entpricht nicht dem Exportieren zu einem anderen Dateityp!
<br><br>
Skalierungsmodus: <select name="skalierung">
<option value="">-bitte wählen</option>
<option value="-1" <?php if($skalierung=="-1") {echo "selected";}?>>neue Breite</option>
<option value="-2" <?php if($skalierung=="-2") {echo "selected";}?>>neue Höhe</option>
<option value="0" <?php if($skalierung=="0") {echo "selected";}?>>neue längste Seite</option>
<option value="1" <?php if($skalierung=="1") {echo "selected";}?>>neue kürzeste Seite</option>
</select><br><br><br>
<input type="submit" name="send" value="absenden">
</form>
//Und hier die Prüfung des Formulars und der Aufruf der Funktion:
<?php
if($send)
{
	if(!empty($filepath_ori) && !empty($breite) && !empty($datei) && !empty($skalierung))
	{
	$filepath_ori = str_replace($base_url,"./",$filepath_ori);
		if(file_exists($filepath_ori))
		{
				if(empty($endung))
					{
					$image_attributes = getimagesize($filepath_ori);
					$endung = $image_attributes[2];
					if($endung==1) {$endung=".gif";}
					if($endung==2) {$endung=".jpg";}
					if($endung==3) {$endung=".png";}
					}
					else
					{
					if($endung==1) {$endung=".gif";}
					if($endung==2) {$endung=".jpg";}
					if($endung==3) {$endung=".png";}
					if($endung==4) {$endung=".swf";}
					if($endung==6) {$endung=".bmp";}
					if($endung==17) {$endung=".ico";}
					}
				$filepath_new=$dir.$datei.$endung;
				resizeImage ($filepath_ori, $filepath_new, $breite, $scale_mode = $skalierung);
		}
		else
		{
			echo "Originalbild ist nicht vorhanden!<br>";
		}
			if(file_exists($filepath_new))
			{
				echo "<br>Das Bild wurde erfolgreich skaliert. Klicke auf den Link und schau es dir an:<br>";
				echo "<a rel='external nofollow' href='".$base_url."wp-content/uploads/neu/".$datei.$endung."'>".$base_url."wp-content/uploads/neu/".$datei.$endung."</a>";
			}
			else
			{
				echo "Da hat was nicht geklappt!<br>";
			}
	}
	else
	{
	echo "Formular ausfüllen!";
	}
}
?>
</body>
</html>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

<?php

$filepath_ori = $_POST['filepath_ori'];

$breite = $_POST['breite'];

$datei = $_POST['datei'];

$endung = $_POST['endung'];

$skalierung = $_POST['skalierung'];

$send = $_POST['send'];

//Hier folgt die Funktion:

function resizeImage ($filepath_ori, $filepath_new, $image_dimension, $scale_mode = 0) {

if ( !(file_exists ($filepath_ori) ) ) return false;

$image_attributes = getimagesize ($filepath_ori);

$image_width_old = $image_attributes[0];

$image_height_old = $image_attributes[1];

$image_filetype = $image_attributes[2];

if ($image_width_old <= 0 || $image_height_old <= 0) return false;

$image_aspectratio = $image_width_old / $image_height_old;

if ($scale_mode == 0) {

$scale_mode = ($image_aspectratio > 1 ? -1 : -2);

} elseif ($scale_mode == 1) {

$scale_mode = ($image_aspectratio > 1 ? -2 : -1);

}

if ($scale_mode == -1) {

$image_width_new = $image_dimension;

$image_height_new = round ($image_dimension / $image_aspectratio);

} elseif ($scale_mode == -2) {

$image_height_new = $image_dimension;

$image_width_new = round ($image_dimension * $image_aspectratio);

} else {

return false;

}

switch ($image_filetype) {

case 1:

$image_old = imagecreatefromgif ($filepath_ori);

$image_new = imagecreate ($image_width_new, $image_height_new);

imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);

imagegif ($image_new, $filepath_new);

break;

case 2:

$image_old = imagecreatefromjpeg ($filepath_ori);

$image_new = imagecreatetruecolor ($image_width_new, $image_height_new);

imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);

imagejpeg ($image_new, $filepath_new);

break;

case 3:

$image_old = imagecreatefrompng ($filepath_ori);

$image_colordepth = imagecolorstotal ($image_old);

if ($image_colordepth == 0 || $image_colordepth > 255) {

$image_new = imagecreatetruecolor ($image_width_new, $image_height_new);

} else {

$image_new = imagecreate ($image_width_new, $image_height_new);

}

imagealphablending ($image_new, false);

imagecopyresampled ($image_new, $image_old, 0, 0, 0, 0, $image_width_new, $image_height_new, $image_width_old, $image_height_old);

imagesavealpha ($image_new, true);

imagepng ($image_new, $filepath_new);

break;

default:

return false;

}

imagedestroy ($image_old);

imagedestroy ($image_new);

return true;

}

$base_url = "http://" . $_SERVER['SERVER_NAME'] . "/";

//Bei manchen Servern ist es nötig den absoluten Pfad anzugeben:

$dir = "/var/www/virtual/xxxxx.de/xxxxxx.de/htdocs/wp-content/uploads/neu/";

//Man sollte aber auch probieren ob ein relativer Pfad reicht:

#$dir = "./wp-content/uploads/neu/";

//Hier kommt das Formular zur Eingabe:

<html>

<head>

</head>

<body>

<form action="<?php echo $base_url; ?>programmierung/codeschnipsel/bilder-skalieren-mit-php/" method="post">

URL zum Originalbild*: <input type="text" name="filepath_ori" value=""><br>

*komplette URL, also zb: https://www.all4hardware4u.de/wp-content/uploads/2013/11/bild.jpg

neue Breite in PX: <input type="text" name="breite" value="<?php echo $breite; ?>"><br><br>

neuer Dateiname: <input type="text" name="datei" value="<?php echo $datei; ?>"><br><br>

neuer Dateityp**: <select name="endung">

<option value="">-nicht ändern</option>

</select><br>

**Achtung! Das Ändern der Dateiänderung entpricht nicht dem Exportieren zu einem anderen Dateityp!

Skalierungsmodus: <select name="skalierung">

<option value="">-bitte wählen</option>

<option value="-1" <?php if($skalierung=="-1") {echo "selected";}?>>neue Breite</option>

<option value="0" <?php if($skalierung=="0") {echo "selected";}?>>neue längste Seite</option>

<option value="1" <?php if($skalierung=="1") {echo "selected";}?>>neue kürzeste Seite</option>

</select><br><br><br>

</form>

//Und hier die Prüfung des Formulars und der Aufruf der Funktion:

<?php

if($send)

{

if(!empty($filepath_ori) && !empty($breite) && !empty($datei) && !empty($skalierung))

{

$filepath_ori = str_replace($base_url,"./",$filepath_ori);

if(file_exists($filepath_ori))

{

if(empty($endung))

{

$image_attributes = getimagesize($filepath_ori);

$endung = $image_attributes[2];

if($endung==1) {$endung=".gif";}

if($endung==2) {$endung=".jpg";}

if($endung==3) {$endung=".png";}

}

else

{

if($endung==1) {$endung=".gif";}

if($endung==2) {$endung=".jpg";}

if($endung==3) {$endung=".png";}

if($endung==4) {$endung=".swf";}

if($endung==6) {$endung=".bmp";}

if($endung==17) {$endung=".ico";}

}

$filepath_new=$dir.$datei.$endung;

resizeImage ($filepath_ori, $filepath_new, $breite, $scale_mode = $skalierung);

}

else

{

echo "Originalbild ist nicht vorhanden!<br>";

}

if(file_exists($filepath_new))

{

echo "<br>Das Bild wurde erfolgreich skaliert. Klicke auf den Link und schau es dir an:<br>";

echo "<a rel='external nofollow' href='".$base_url."wp-content/uploads/neu/".$datei.$endung."'>".$base_url."wp-content/uploads/neu/".$datei.$endung."</a>";

}

else

{

echo "Da hat was nicht geklappt!<br>";

}

else

{

echo "Formular ausfüllen!";

}

</body>

</html>

(Bildquelle Yvonne Biondi Babycenter Schweiz)

Hier kannst du dein Bild skalieren:

Bewerte den Artikel, wenn du magst:

[Gesamt: 22 Durchschnitt: 4.9/5]

4 Kommentare

Christoph / 16. Februar 2018 um 09:01
Danke, das ist ein tolles Script!!!
Ich habe es bei einem Projekt erfolgreich im Einsatz.
Mir ist aufgefallen, dass es bei Bildern bei denen eine Seite größer als ca. 5.650px ist, Probleme gibt.
Ist da etwas bekannt, bzw. wie kann ich das lösen?
Vielen Dank!
Bewerte diesen Kommentar, wenn du magst:
[Gesamt: 2 Durchschnitt: 4/5]
Beantworten
- Harry Milatz / 16. Februar 2018 um 13:48
  Hi Christoph,
  schön wenn dir das Script geholfen hat!
  Inwiefern zeigen sich da Probleme? Welche Fehlermeldung bekommst du?
  Gruss Harry
  Bewerte diesen Kommentar, wenn du magst:
  [Gesamt: 2 Durchschnitt: 5/5]
  Beantworten
  - Christoph / 16. Februar 2018 um 16:52
    Hallo Harry,
    ich hab eines der betroffenen Bilder jetzt auch mit dem Formular auf deiner Seite getestet.
    Hier das Originalbild: http://neu.scharinger-reisen.at/images/reisen/WallfahrtnachInnsbruck/0001.jpg
    Neue Breite: 1000
    Scale Mode: -1
    Auch so funktioniert es nicht.
    Woran kann das liegen bzw. hast du einen Workaround für mich?
    Vielen Dank & beste Grüße
    Bewerte diesen Kommentar, wenn du magst:
    [Gesamt: 1 Durchschnitt: 5/5]
    Beantworten
    - Harry Milatz / 17. Februar 2018 um 00:23
      Hi Christoph,
      also bei mir hier auf der Seite klappt das problemlos. Habe es eben mal auf 1000 Pixel Breite skaliert:
      https://www.all4hardware4u.de/wp-content/uploads/neu/test.jpg
      Du kannst es ja mal hier auf der Seite selbst probieren.
      Da muss also bei dir eventuell beim Server eine Einschränkung sein. Frag doch deinen Hoster mal. Welche PHP Version nutzt du? Das Script läuft eventuell nicht korrekt unter PHP7, das habe ich aber noch nicht geprüft.
      Gruss Harry
      Bewerte diesen Kommentar, wenn du magst:
      [Gesamt: 2 Durchschnitt: 4/5]
      Beantworten

Kommentar verfassen Antworten abbrechen

Du kannst auch mit einem deiner folgenden Profile kommentieren*:

* Zustimmung zur Datenschutzerklärung
Dieses Kommentarformular speichert Name, E-Mailadresse und Inhalt, sowie die IP-Adresse für maximal 60 Tage. Für detaillierte Informationen lies bitte unsere Datenschutzerklärung.

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert. - HTML ist erlaubt.Du kannst folgende HTML Tags und Attribute benutzen:
<a href="" title=""> <abbr title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strong> <pre style="" class="" title="" data-url=""> <span style="" class="" title="" data-url=""> .