# Bilder skalieren und quadratisch anzeigen



## ciberjoerg (9. Juni 2010)

Hi ich wollte mich mal erkundigen wie man für eine Bildvorschau ein Bild aus der Mitte Zentriert und oder je nach Bildformat ein Quadratisches Bild zur preview zu erstellen.

Angenommen ein User Lädt ein Bild mit den maßen 800X600 hoch, dieses soll entweder beim upload bereits mit einem Thumbnail mit Quadratischen maßen gespeichert werden oder eben erst beim anzeigen im Userprofil.

Wie kann ich das Umsetzen wobei mir die Thumbnail Variante nicht grad gut gefällt, aber ich würde gerne die Server entlastenste Methode nehmen.
Was könnt ihr mir da empfehlen?

Beispiel wie ich die bilder gerne hätte findet ihr auf http://www.mysmag.de unter Community.


----------



## Yaslaw (9. Juni 2010)

Versteh ich das Richtig, du willst ein rechteckiges Bild auf quadratisch verziehen, nicht schneiden.


----------



## ciberjoerg (9. Juni 2010)

Doch schon schneiden. So das es dann Quadratisch ist. Am liebsten eben nur für die preview des Bildes wenn ich dazu keine Thumbnails nutzen Müsste wäre das am besten. Einfach so das ähnlich Wie bei Flash nur ein Quadrat via Maske aus dem Bild angezeigt wird.


----------



## Yaslaw (9. Juni 2010)

Du machst ein eigenes Script, dass anstelle der Grafik aufgerufen wird

```
<img src="thump.php?img=grafik1.jpg">
```

das thumb.php ist etwa so aufgebaut:

getimagesize() die Grösse des Bildes auslesen
min() die kleinere Seite auslesen -> Schrumpffaktor errechnen
imagecreatefromjpeg() Bestehende Grafik einlesen (ggf ...fromgif, ...frompng etc)
imagecreate() eine neue Grafik werstellen
imagecopyresized() den Ausschnit kopieren und verkleinert in die neue Grafik einfügen
header() Dateiheader ausgeben
imagepng() die Grafik zurückgeben
imagedestroy() auf die Quell-und Thumb-Grafik anwednen um die Ressource im Speicher zu löschen.

Hier noch die übersicht über alle image-Befehle in PHP
http://ch.php.net/manual/de/ref.image.php


----------



## ciberjoerg (9. Juni 2010)

Das klingt schon mal sehr gut. Ich werd das mal versuchen ein script auszuarbeiten, wenn ich noch Fragen dazu hab Meld ich mich nochmal.

aber ist diese Variante bei knapp 30 bildern nicht etwas Langsam?


----------



## splasch (9. Juni 2010)

Du kannst phpthumb dafür verwenden leichter geht wirklich nicht mehr.

Hier nee Anleitung dazu:
http://dev.xscheme.de/2008/09/quadratische-thumbnails-erstellen-php/

Mfg Splasch


----------



## ciberjoerg (9. Juni 2010)

So nach kurzer Arbeit und hoffentlich Richtigem Verstehen sieht mein code nun wie folgt aus:

```
<?
$img= $_GET['img'];

list($width, $height, $type) = getimagesize($img);
$min = min($width, $height);
echo $min;
$im=@imagecreatefromjpeg($img);
if(!$im){
    $im=imagecreate(150,150);
    imagecopyresized($im, $img,0,0,0,0, 150, 150, $width, $height);//die 4 nullen kann ich nicht genau zuortnen da ich eben diesen codeausschnitt von php.net habe
}
header( "Content-type: image/jpeg" );
imagejpeg($im);
imagedestroy( $im );

echo"<img src='$im' border='0' />";
?>
```
Da ich nun keine ahnung habe ob das ganze auch funktioniert, wollte ich dies nochmal eben durchschauen lassen. Ich vermute mal das die 0 nullen im imagecopyresized die position angeben von wo der ausschnitt aus dem alten Bild ausgelesen werden soll. doch leider kann ich diese noch nicht richtig positionieren da ich diese ja eigentlich von der kleinsten stelle aus entweder von oben zentriert ober mittich auslesen möchte.


----------



## timestamp (9. Juni 2010)

Hi

auf PHP.net findet sich ja die folgende Beschreibung:

```
int imagecopyresized  (  resource $dst_im  ,  resource $src_im  ,  int $dstX  ,  int $dstY  ,  int $srcX  ,  int $srcY  ,  int $dstW  ,  int $dstH  ,  int $srcW  ,  int $srcH  )
```

$dst würde ich jetzt mal destination, also Ziel, zuordner, sprich das Bild in was hineinkopiert werden soll. X und Y hast du ja schon richtig erkannt, geben die Stelle des Zielbildes an, an die das Quellbild (src = source = Quelle) kopiert werden soll.


----------



## ciberjoerg (9. Juni 2010)

Ich hab das Script mal getestet, aber leider funktioniert das nicht so wie ich mir das vorstelle.

```
<?
//$img= $_GET['img'];
$img= "plants.jpg";
list($width, $height, $type) = getimagesize($img);
$min = min($width, $height);
$im=@imagecreatefromjpeg($img);
if(!$im){
    $im=imagecreate(150,150);
    $nimg=imagecopyresized($im, $img,150,150,0,0, 150, 150, $width, $height);//die 4 nullen kann ich nicht genauzuortnen da ich eben diesen codeausschnitt von php.net habe
}
//header( "Content-type: image/jpeg" );
imagejpeg($im, "s".$img, 100);
imagedestroy( $im );

echo"<img src='s$img' border='0' />";
?>
```
http://darkbase.pytalhost.de/includes/thumb.php dort zu sehen was passiert.
Bild sollte eigentlich Quadratisch angezeigt werden und dann eben auch nur einen ausschnitt vom eigentlichem bild.


----------



## ciberjoerg (9. Juni 2010)

ich hab eben nochmals im inet gesucht und hab nun folgendes script entdeckt.

```
<?php
header("Content-Type: image/jpeg", true);

$file = "plants.jpg";
$pro = "150";

$imgsrc = imagecreatefromjpeg($file);
$width = imagesx($imgsrc);
$height = imagesy($imgsrc);

$newwidth=round(($width / 100) * $pro);
$newheight=round(($height / 100) * $pro);
$newimg=imagecreatetruecolor($newwidth,$newheight);
imagecopyresampled($newimg, $imgsrc, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);

$xpos=rand(0,$newwidth-150);
$ypos=rand(0,$newheight-150);

$timg=imagecreatetruecolor(150,150);

imagecopy($timg,$newimg,0,0,$xpos,$ypos,150,150);

$color = imagecolorallocate($timg, 226, 224, 235); imagerectangle($timg, 0, 0, 149, 149, $color);
$color = imagecolorallocate($timg, 251, 254, 247); imagerectangle($timg, 1, 1, 148, 148, $color);

imagejpeg($timg,"",100);

imagedestroy($imgsrc);
imagedestroy($newimg);
imagedestroy($timg);
?>
```
doch leider wird nur ein ausschnitt  gemacht und nicht das bild aus der mitter her skaliert


----------



## timestamp (9. Juni 2010)

Hi

setzte mal an den Anfang des Scriptes ein 

```
error_reporting(E_ALL);
```

edit:
Ich sehe gerade Deinen Fehler im ersten Script: Du hast viel zu viele Parameter übergeben


----------



## Frezl (26. November 2010)

Du kannst Bilder auch mit HTML maskieren, ohne sie zuschneiden zu müssen: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#clip

Wollt das nur noch anmerken für die Leute, die sich den Thread auf der Suche nach ner Lösung durchsehen werden...

Grüße,
Frezl


----------

