Resize e crop immagini in php
Scrivendo un articolo per il web spesso si fa riferimento ad immagini che non necessariamente sono sul vostro sito e che mal si adattano al layout del pezzo che si sta scrivendo.
Spesso per pigrizia si include l’immagine originale facendo fare il lavoro di scalatura al browser, specificando nel tag “img” o l’altezza o l’ampiezza, in questo caso pero’, se l’immagine originale è molto grande, il tempo di caricamento della pagina aumenta e comunque non è buona pratica fare in questo modo.
Normalmente si prende l’immagine originale, si scala/ritaglia con un programma apposito e si copia l’immagine così trattata sul proprio sito.
Operazioni che portano via parecchio tempo.
Questo script PHP fa questo lavoro in automatico: genera un’immagine scalata (ed eventualmente ritagliata) data la url dell’immagine “sorgente” e delle dimensioni specificate come parametri.
L’immagine prodotta viene salvata in locale in uno spazio temporaneo (cache) per evitare di fare tutte le volte le richieste all’immagine sorgente.
Ecco un esempio dell’utilizzo che se ne può fare:
L’ immagine originale è su Wikipedia.
L’ho inclusa nell’articolo riducendola e ritagliandola automaticamente con questo codice html
<img src="https://fabrizio.zellini.org/resizer/resize.php?url=http://upload.wikimedia.org/wikipedia/commons/1/15/Giulio-cesare-enhanced_1-800x1450.jpg&size=80x100c10" alt="Giulio Cesare" />
Praticamente lo script fa da “proxy” per l’immagine data nel parametro “url”:
L’immagine viene scalata alla dimensione voluta ed eventualmente ritagliata secondo quanto specificato nel parametro “size”.
I parametri sono:
- url
- url dell’immagine da ritagliare/scalare
- size
- dimesioni immagine in uscita: Il formato è: <Ampiezza>x<Altezza>[c[<posizione crop>]]
La posizione del crop varia tra 0 (ritaglio dall’inizio o dall’alto) a 100 (ritaglio dalla fine o dal basso).
Per default è 50, ovvero il ritaglio viene fatto simmetricamente dal centro dell’immagine.
Se il crop non è specificato, l’immagine originale viene solo scalata in modo che entri nel rettangolo destinazione, mantenendo le proporzioni originali.
Dato che potenzialmente chiunque potrebbe utilizzare lo script per scalare e ritagliare immagini, per limitare l’utilizzo ho previsto la possibilità di codificare i parametri con una chiave.
Volendo tale chiave può essere cambiata, l’importante è che chi la codifica e chi la decodifica (ovvero lo script) utilizzino la stessa.
Trovate maggiori dettagli nel README contenuto nella distribuzione.
Come esempio proviamo a scalare e ritagliare questa immagine della Luna.
Sotto le immagini c’è la url con i parametri dati allo script.
https://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3115/2921654949_6b781fe756.jpg&size=80x80
http://fabrizio.zellini.org/resizer/resize.php?url=http://farm4.static.flickr.com/3115/2921654949_6b781fe756.jpg&size=200x50c
https://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3115/2921654949_6b781fe756.jpg&size=50x200c
Qui si può vedere come funziona il cropping con questa immagine.
parametro c0 (crop a sinistra)
http://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3225/2930395691_13d730b83c.jpg&size=100x100c0
parametro c50 o c (crop al centro)
https://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3225/2930395691_13d730b83c.jpg&size=100x100c50
parametro c100 (crop a partire dal fondo)
https://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3225/2930395691_13d730b83c.jpg&size=100x100c100
senza parametro c l’immagine viene inscritta nel rettangolo 100×100
https://fabrizio.zellini.org/resizer/resize.php?url=https://farm4.static.flickr.com/3225/2930395691_13d730b83c.jpg&size=100x100
Aggiornamento: dalla versione 0.1.4 è possibile applicare un crop all’immagine sorgente prima di effettuare il vero e proprio crop-resize: in questo modo diventa possibile estrarre solo una parte dell’immagine sorgente prima di scalarla.
Esempio:
http://fabrizio.zellini.org/resizer/resize.php?url=https://www.google.com/intl/en_ALL/images/logo.gif& size=(0,0,70,80)35x40
Lo script installato su questo server è (per ora) “aperto”, nel senso che i parametri non sono codificati, quindi potete usarlo per provare a scalare e ritagliare qualsiasi immagine… non abusatene mi raccomando, una volta valutato installatelo sul vostro server….
Note sulla url:
se la url dell’immagine di cui volete fare il resizer contiene spazi, basta sostituire agli spazi la stringa %2520.
Esempio:
Per https://fabrizio.zellini.org/foto/photos/Campagna/Torre%20antica%20a%20Stracciacappa.jpg immagine usate questa sintassi per la url
https://fabrizio.zellini.org/resizer/resize.php?url=http://fabrizio.zellini.org/foto/photos/Campagna/Torre%2520antica%2520a%2520Stracciacappa.jpg&size=640x400c
Ecco il risultato:
Trovate l’ultima versione del pacchetto qui, tutte le versioni sono qui
Stai leggendo “ Resize e crop immagini in php ”, un post di Fabrizio Zellini
- Pubblicato il
- 10 Ottobre 2008 //php the_time('G:i') ?>
- Categorie:
- php
74 Commenti
commenta | feed commenti [?] | trackback uri [?]