Contactez-nous

1

Changer le format d’une image et supprimer la transparence

16 avril 2006
par ARNO*

[SPIP 1.9 et GD2] Voici un filtre technique qui, dans son usage le plus immédiat, ne provoque aucun effet graphique : il se contente de supprimer la transparence d’une image et de sauvegarder l’image dans un format déterminé.

Nous en aurons certainement une utilité nettement plus créative par la suite, mais pour l’instant, contentons-nous de l’utiliser pour aplatir une image et, surtout, la convertir dans un certain format graphique.

Notez bien : ce filtre est désormais inclus en standard dans SPIP 1.9. Vous n’avez donc pas besoin de le recopier dans votre fichier mes_fonctions.php.

Voici notre filtre :

  1. function image_aplatir($im, $format='jpg', $coul='000000')
  2. {
  3. $image = valeurs_image_trans($im, "aplatir-$coul", $format);
  4. if (!$image) return("");
  5.  
  6. include_ecrire("filtres");
  7. $couleurs = couleur_hex_to_dec($coul);
  8. $dr= $couleurs["red"];
  9. $dv= $couleurs["green"];
  10. $db= $couleurs["blue"];
  11.  
  12. $x_i = $image["largeur"];
  13. $y_i = $image["hauteur"];
  14.  
  15. $im = $image["fichier"];
  16. $dest = $image["fichier_dest"];
  17.  
  18. $creer = $image["creer"];
  19.  
  20. if ($creer) {
  21. $im = $image["fonction_imagecreatefrom"]($im);
  22. $im_ = imagecreatetruecolor($x_i, $y_i);
  23. @imagealphablending($im_, false);
  24. @imagesavealpha($im_,true);
  25. $color_t = ImageColorAllocateAlpha( $im_, $dr, $dv, $db , 0 );
  26. imagefill ($im_, 0, 0, $color_t);
  27.  
  28. $dist = abs($trait);
  29. for ($x = 0; $x < $x_i; $x++) {
  30. for ($y=0; $y < $y_i; $y++) {
  31.  
  32. $rgb = ImageColorAt($im, $x, $y);
  33. $a = ($rgb >> 24) & 0xFF;
  34. $r = ($rgb >> 16) & 0xFF;
  35. $g = ($rgb >> 8) & 0xFF;
  36. $b = $rgb & 0xFF;
  37.  
  38. $a = (127-$a) / 127;
  39.  
  40. if ($a == 1) { // Limiter calculs
  41. $r = $r;
  42. $g = $g;
  43. $b = $b;
  44. } else {
  45. $r = round($a * $r + $dr * (1-$a));
  46. $g = round($a * $g + $dv * (1-$a));
  47. $b = round($a * $b + $db * (1-$a));
  48. }
  49.  
  50. $color = ImageColorAllocateAlpha( $im_, $r, $g, $b , 0 );
  51. imagesetpixel ($im_, $x, $y, $color);
  52. }
  53. }
  54. $image["fonction_image"]($im_, "$dest");
  55. }
  56.  
  57. $class = $image["class"];
  58. if (strlen($class) > 1) $tags=" class='$class'";
  59. $tags = "$tags alt='".$image["alt"]."'";
  60. $style = $image["style"];
  61.  
  62. return "<img src='$dest'$tags />";
  63. }

Télécharger

On aurait pu encore limiter les calculs, dans le cas des fichiers JPEG, puisque ceux-ci n’étant jamais transparents, il suffisait de faire une conversion de fichier sans se poser de questions (ici, on parcourt tout de même l’image pixel par pixel pour « fusionner » les pixels semi-transparents et la couleur de fond choisie). Mais, en réalité, ce filtre n’est pas destiné à aux images qui sont déjà en JPEG, puisque justement c’est le meilleur compromis entre le poids et la qualité pour des photographies Web.

Utilisation simple et directe pour l’instant : convertir des fichiers PNG 24 en fichiers GIF ou en fichiers JPEG.
- Appliqué à des photographies, on réduit énormément le poids des fichiers (PNG 24 est un format excessivement lourd).
- Appliqué à des images typographiques, on peut par exemple supprimer la transparence, ce qui dans certains cas facilitera l’utilisation (par exemple en tant qu’image de fond d’une classe CSS). En revanche, sur les images typographiques, l’argument du poids du fichier n’est pas aussi pertinent, le PNG 24 compressant assez bien les aplats de couleurs.

  1. [(#TITRE
  2. |image_typo{police=stencil.ttf,couleur=000000,taille=40})]
  3. [(#TITRE
  4. |image_typo{police=stencil.ttf,couleur=000000,taille=40}
  5. |image_aplatir{gif,ff0000})]

Télécharger

On a donc notre image typographiques d’origine, fichier PNG avec transparence :

on obtient un fichier GIF, non transparent, dont on a fixé la couleur du fond :

N.B. Ne convertissez pas des images typographiques en JPEG : le JPEG provoque dans les images comportant d’importants aplats de couleurs des artefacts de compression hideux.

  • Franz
    Juin 2006

    Salut,

    La manière dont le code source des filtres est affiché est vraiment très très jolie (c’est disponible quelque part le code pour faire ça ?) mais présente quand même l’inconvénient, certes mineur, que le copier-coller est moins facile à pratiquer qu’avec un bête textarea tel que SPIP en fabrique un en standard pour les balises <cadre></cadre>.

    Peut-être mettre aussi le code des filtres dans un fichier texte en en pièce jointe téléchargeable facilitterait-il la vie des visiteurs ?

    Félicitations pour le site et pour toute l’inventivité qui y est déployée,

  • ARNO*
    Juin 2006

    Voilà, j’ai modifié le plugin d’affichage du code, et désormais un lien « Télécharger » propose, à la fin du script, de récupérer un fichier le contenant. Ca devrait être plus pratique.

    Le plugin qui permet de coloriser ainsi le code (et, dans le cas de PHP, d’ajouter des liens hypertextes vers les définitions des fonctions dans la doc officielle) est « coloration_code ».

  • Septembre 2006

    Ce serait une piste peut-être pour fabriquer des favicons systématiquement pour les sites sous SPIP ça non ?

    #LOGO_SITE_SPIP avec un 16*16 ?

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.