1

Réduire les dimensions d’une image selon un certain facteur

20 mars 2006
par ARNO*

[SPIP 1.8] Le filtre reduire_image a été conçu pour réduire les dimensions d’une image selon les dimensions maximales de l’image réduite. L’utilisation principale dans une page Web d’une telle réduction d’image a, en effet, généralement besoin de valeurs maximales :
— limiter les dimensions lors d’un affichage, pour éviter qu’une trop grande image fasse exploser la maquette ;
— forcer une des dimensions de vignettes alignées, de façon à obtenir un bel alignement (par exemple, si l’on place les vignettes les unes à côté des autres horizontalement, on voudra leur donner à toutes la même hauteur).

Mais dans certains cas, on voudra réduire les dimensions de l’image selon une certaine proportion. Par exemple : diviser les dimensions de l’image par 2. Les nouveaux filtres de la version 1.9 rendent assez souvent nécessaire le recours à une telle réduction :
— les images typographiques (image_typo) rendues dans des petites tailles sont généralement assez laides ; on pourra ici créer des images typographiques de taille double et les réduire par deux ;
— certains filtres, tels que la rotation (image_rotation), provoquent l’apparition d’effets d’escalier ; on pourra donc souhaiter réduire la taille d’une image après rotation pour réduire ces effets. Ainsi, dans notre exemple sur la création d’un timbre, après la rotation du timbre, nous préconisions de réduire les dimensions de l’image.

L’effet d’une réduction à plusieurs corps
Le filtre de réduction d’image appliqué à plusieurs tailles de caractères. Pour chacune des tailles, la version verte présente l’image typographique créée directement à la « bonne taille » ; la version noire est d’abord créée en taille double, puis réduite par deux.
À gauche, on voit que l’image qui vient de subir une rotation présente de très nets effets d’escalier. À droite, la réduction de l’image « lisse » l’image.

L’idée est donc de réduire l’image, sans connaître a priori ses dimensions (ce qui est le cas avec une image typographique, dont les dimensions dépendent du texte utilisé, et d’une image ayant subit une rotation). On veut ici effectuer la réduction selon un certain facteur, et non une dimension maximale.

Voici un filtre très simple pour réaliser cet effet :

  1. function image_diviser_par ($img, $val) {
  2.         include_ecrire("filtres");
  3.        
  4.         $l = round(largeur($img)/$val);
  5.         $h = round(hauteur($img)/$val);
  6.        
  7.         if ($l > $h) $h = 0;
  8.         else $l = 0;
  9.        
  10.         $img = reduire_image($img, $l, $h);
  11.  
  12.         return $img;
  13. }

Télécharger

On peut l’appliquer à une image typographique ainsi :

  1. <div>[(#TITRE|image_typo{taille=12})]</div>
  2. <div>[(#TITRE|image_typo{taille=24}|image_diviser_par{2})]</div>

Télécharger

Le premier « rendu » demande directement à créer le titre en corps 12. Le second commence par demander le titre en corps 24, puis réduit l’image par deux, on revient donc à l’équilalent du corps 12. Selon la taille désirée et la police de caractères utilisés, on pourra choisir l’une ou l’autre méthode : souvent la version sans réduction, directement dans un petit corps, est un peu plus « nette », mais le dessin des caractères et les approches sont assez désastreux ; alors que la version rendue plus grande puis réduite est un peu plus « floue » (ou « lissée »), donc un peu moins lisible, mais beaucoup plus jolie.


Notez bien : ce filtre est désormais inclus en standard dans SPIP 1.9, sous le nom image_reduire_par.

Qui êtes-vous ?
Votre message

Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.