4min Devops

How to: [PHP] Een thumbnail maken met GD

Verkleinen

Het verkleinen


Nu de plaatjes objecten zijn aangemaakt kan er mee worden gewerkt. Om het plaatje te verkleinen worden de functies imagecopyresized of imagecopyresampled gebruikt. Beide functies worden op dezelfde manier gebruikt maar verwerken hun taak net even anders.

Het gebruiken van de functie ziet er als volgt uit:
PHP Code
1
bool imagecopyresized  ( resource $dst_image  , resource $src_image  , int $dst_x  , int $dst_y  , int $src_x  , int $src_y  , int $dst_w  , int $dst_h  , int $src_w  , int $src_h  )

De afkortingen dst en src worden hier regelmatig gebruikt. Dst staat voor het Engelse destination. In het Nederlands vertaald is dit doel. Src staat voor het Engelse source, wat bron betekent. De argumenten staan dus als volgt:
  • resource $dst_image
    Het doel plaatje. Dit is een resource, dat betekent dus het object thumbnail (dat is namelijk waar we het in willen zetten).
  • resource $src_image
    Het bron plaatje. Dit is ook een resource. Dat betekent het ingelezen plaatje van bestand.
  • int $dst_x
    Int staat voor integer, in Nederlands betekent dat ‘geheel getal’. $dst_x staat voor de doel x. Dit is de x-waarde waar PHP het verkleinde plaatje moet neerzetten
  • int $dst_y
    dst_y staat voor doel y. Dit is net zoals bij dst_x de plek waar het plaatje wordt neergezet, maar nu de y waarde. dst_x en dst_y maken het beginpunt.
  • int $src_x
    src_x is het beginpunt (de x waarde) waar in het bron object moet worden gezocht.
  • int $src_y
    src_y is het beginpunt (de y waarde) waar in het bron object moet worden gezocht.
  • int $dst_w
    dst_w is de breedte die het verkleinde plaatje moet krijgen in het doel bestand.
  • int $dst_h
    dst_h is de hoogte die het verkleinde plaatje moet krijgen in het doel bestand.
  • int $src_w
    src_w is de breedte van het bron plaatje.
  • int $src_h
    src_h is de hoogte van het bron plaatje.

Het invullen van de argumenten


Al deze argumenten moeten worden ingevuld. $dst_image is ons doelplaatje, dat is $Thumbnail. $src_image is ons bronplaatje, dat is het plaatje dat is ingelezen van het bestand, dus $Plaatje. $dst_x en $dst_y is het beginpunt waar het plaatje moet worden weggezet. Dit is altijd van de linker bovenhoek gezien. Aangezien de thumbnail het hele plaatje moet opvullen moet de thumbnail helemaal linksboven beginnen.

Dit betekent dat de coordinaten van dit punt 0,0 zijn. We vullen dit dus ook voor dst_x en dst_y in. De bron (src_x en src_y) volgt dezelfde redenatie. Het hele originele plaatje moet worden gekopieerd dus beginnen we daar linksboven, op punt 0,0.

De doel breedte en hoogte (dst_w en dst_h respectievelijk) is de grootte van onze thumbnail. Aangezien die is vastgelegd in $Thumbnail_breedte en $Thumbnail_hoogte geven we deze twee argumenten op. Als bron breedte en hoogte (src_w en src_h) zetten we de breedte en hoogte van het originele plaatje er in.

Deze laatste twee gegevens moeten worden uitgelezen, het bronplaatje kan namelijk steeds anders zijn en daardoor dus ook de breedte en hoogte. De breedte van een plaatje kan worden uitgelezen door imagesx() te gebruiken. Deze leest de grootte van de X uit. De X waarde is altijd op de horizontale lijn, dus de breedte van het plaatje.

De hoogte van het plaatje kan worden uitgelezen met imagesy(). Deze leest de grootte van de Y uit. Die is altijd de verticale lijn, dus de hoogte van het plaatje. Deze beide waardes stoppen we voor de duidelijkheid in $Plaatje_breedte en $Plaatje_hoogte. De voorbeeldcode vind je hieronder:

PHP Code
1
2
3
4
5
6
7
8
9
10
 
<?php
// We lezen de breedte en hoogte uit van het originele plaatje
// Deze hebben we nodig bij imagecopyresized of imagecopyresampled.
$Plaatje_breedte = imagesx($Plaatje);
$Plaatje_hoogte = imagesy($Plaatje);
 
// Het verkleinen van het origineel ($Plaatje) naar de thumbnail $Thumbnail.
imagecopyresized($Thumbnail, $Plaatje, 0, 0, 0, 0, $Thumbnail_breedte, $Thumbnail_hoogte, $Plaatje_breedte, $Plaatje_hoogte);
?>

Verschil tussen imagecopyresized en imagecopyresampled


Eerder genoemd in deze tutorial was het verschil tussen imagecopyresized en imagecopyresampled. Bij copyresampled worden de kleuren herberekend zodat er een ‘zachte’ overgang is. Kleuren van verschillende pixels worden gemengd met elkaar. Dit heeft als resultaat dat het plaatje relatief duidelijk blijft bij kleinere afmetingen.

Een voorbeeld van de twee functies zie je hieronder, het origineel kun je (hier vinden.)

How to: [PHP] Een thumbnail maken met GD
How to: [PHP] Een thumbnail maken met GD
Resized
Resampled

Let wel op, hoewel de kwaliteit van resampled beter is, zal er waarschijnlijk wel meer tijd en inspanning van de server nodig zijn om tot zo’n resultaat te komen. Iets wat niet onbelangrijk is mocht je regelmatig plaatjes willen verkleinen!

Table of contents