Convertir SVG en BMP

Ces deux formats se tiennent aux extrémités de tout. Un SVG est du texte : une liste de chemins, de remplissages et de transformations qu’un moteur de rendu transforme en image à la taille demandée, donc le fichier n’a pas de résolution et pas de coût en octets fixé. Un BMP est l’image déjà faite, stockée comme des lignes littérales de couleur sans compression, sans structure et sans rien à interpréter.

Ce fossé est le sujet entier de cette page. Aller dans un sens est un rendu — une décision sur la taille, le fond et l’antialiasing, prise une fois et ensuite permanente. Aller dans l’autre sens n’est pas possible ; il n’y a pas de chemin d’une grille d’octets vers les formes qui l’ont dessinée.

Un attribut de largeur et de hauteur sur un SVG est une suggestion, pas une taille — le dessin est défini par sa viewBox et peut être produit à n’importe quelle résolution. Donc la conversion doit en choisir une, et le réglage d’échelle est cette décision. Le rendu par défaut fait 1 024 pixels de large et la hauteur suit les proportions du dessin ; l’échelle va de 0,1 à 10, ce qui donne de 102 à 10 240 pixels.

Choisissez le nombre dont la destination a réellement besoin plutôt que le plus grand disponible, parce que le coût est ici inhabituellement raide. Contrairement à PNG ou WebP, la taille d’un bitmap ne dépend pas du tout de ce qu’il y a dans l’image : doubler la largeur quadruple le fichier, que le dessin soit une illustration pleine ou un seul trait noir.

Chaque pixel prend trois octets — bleu, vert et rouge, dans cet ordre — et chaque ligne est complétée jusqu’à un multiple de quatre. Ajoutez un en-tête de 54 octets et c’est tout le fichier. Un carré de 1 024 pixels fait 3 072 octets par ligne et 3 145 728 octets de données d’image, soit 3 145 782 au total.

Donc un SVG de quelques centaines d’octets devient environ trois mégaoctets au réglage par défaut, et environ douze à l’échelle 2. Ce n’est pas un défaut du convertisseur ; c’est ce qu’est le BMP, et c’est la raison pour laquelle tout ce qui a le choix prend un autre format. Si la destination a une limite de taille, faites la multiplication avant la conversion plutôt qu’après.

Le bitmap écrit ici fait 24 bits par pixel sans quatrième canal. Il existe une variante d’en-tête qui définit l’alpha, et des fichiers qui l’utilisent existent, mais le support en est exactement le genre de chose que le BMP est en général choisi pour éviter — donc la transparence doit être résolue d’abord.

Le dessin est rendu sur rien puis aplati sur la couleur de fond en une seule passe, ce qui compte : remplir puis mettre à l’échelle ensuite ferait baver le remplissage sur les bords, et mettre à l’échelle une image transparente avant de l’aplatir laisse une frange de pixels semi-transparents que le remplissage assombrit ensuite. Réglez la couleur sur la surface sur laquelle le bitmap sera posé. Le blanc est la valeur par défaut et est faux sur un panneau sombre.

Le rendu est fait par resvg compilé en WebAssembly plutôt que par le moteur SVG du navigateur, et c’est délibéré. Passer un SVG à un canvas donne ce que ce navigateur veut : des métriques de texte différentes, un support de filtres différent, des résultats visiblement différents pour le même fichier dans Chrome et dans Safari. Un seul moteur veut dire que le bitmap est identique sur chaque machine qui le produit.

Cela compte plus ici que sur la plupart des cibles. Un bitmap allant sur un appareil ou dans un installeur est en général vérifié une fois puis cru pour toujours, parfois comparé octet par octet à une référence. Un rendu qui varie selon le navigateur rendrait cette comparaison dénuée de sens.

Le SVG stocke le texte comme texte et désigne une police par son nom. Si la police n’est pas embarquée dans le fichier, le moteur de rendu en choisit une autre, et un motmarque soigneusement espacé revient avec des caractères et un espacement différents. C’est de loin la raison la plus fréquente pour laquelle un SVG rendu semble cassé.

La correction appartient à l’outil de design, pas ici : convertissez le texte en contours ou en chemins avant d’exporter, et les lettres deviennent des formes que rien ne peut remplacer. Cela rend aussi le fichier sûr à transmettre à qui que ce soit, ce qui vaut la peine de toute façon si le dessin va dans un système que vous ne contrôlez pas.

Parce qu’en lire un ne demande aucune bibliothèque. Un microcontrôleur pilotant un petit affichage peut sauter l’en-tête de 54 octets et copier les octets dans un framebuffer avec une boucle ; supporter le PNG sur le même appareil veut dire ajouter un décompresseur, un allocateur mémoire et un parseur de chunk à quelque chose qui peut avoir 32 Ko de RAM.

La même logique couvre les ressources d’installeur chargées par les appels bitmap natifs de la plateforme, les anciens contrôles Windows, et les fixtures de test qui comparent des images sans codec sur le chemin. Dans chaque cas le format est choisi pour sa prévisibilité, et les mégaoctets sont le prix à payer.

Supprimez le bitmap et vous pouvez en faire un autre. Supprimez le SVG et le bitmap est tout ce qu’il y a, et tout ce qui rendait le dessin utile — éditabilité, résolution arbitraire, un historique diffable en texte dans le contrôle de version — disparaît pour de bon. Retracer un BMP en chemins devine les bords et produit un fichier différent avec plus de nœuds et de moins bonnes courbes.

Traitez la conversion comme une étape d’export, idéalement une étape que votre build exécute plutôt qu’une étape que quelqu’un fait à la main. Quand le panneau aura besoin d’une taille différente l’an prochain, refaites le rendu depuis le vecteur plutôt que de mettre à l’échelle un bitmap de trois mégaoctets.

Déposez le jeu entier. Chaque fichier est rendu à la même échelle et aplati sur le même fond, ce qui est en général ce que ces destinations demandent — un jeu de graphiques de panneau qui ne s’accordent pas sur leurs fonds a l’air pire que n’importe lequel d’eux étant individuellement imparfait.

Surveillez la taille totale. Vingt dessins à l’échelle par défaut font environ soixante mégaoctets de bitmap avant le ZIP, ce qui est assez pour être lent sur un téléphone et assez pour remplir le stockage d’un petit appareil. Réduire l’échelle à ce que l’affichage montre réellement est la chose la plus efficace que vous puissiez faire à ce chiffre.

Nulle part. La conversion tourne en JavaScript et WebAssembly dans cet onglet, sans module à télécharger, sans téléversement, sans compte et sans quota quotidien. Ouvrir l’onglet réseau pendant une conversion est la vérification.

Le plafond gratuit est de 100 Mo par fichier, et un BMP de sortie n’a pas de plafond de taille propre. Le batch fonctionne : déposez un dossier, chaque fichier se convertit avec sa propre ligne de progression, et les résultats reviennent en ZIP. Comme la sortie BMP fait exactement trois octets par pixel, un lot de grands dessins produit un ZIP très volumineux, ce qui vaut la peine d’être su avant d’en commencer un.