🇬🇧​ English version (will be available) below

Origine et stockage des fichiers svg bruts

Sources

Les icônes proviennent principalement de 3 sources :

• maki : visualisation et source
• temaki : visualisation et source
• OsmAnd : source

Vous avez bien évidemment aussi la possibilité de dessiner vous même vos propres icônes, par exemple avec Inkscape. Un bonne icône est simple, limpide, compréhensible à très faible zoom (ce n'est pas forcément le cas des icônes OsmAnd).

Consignes pour un fichier brut léger

Dans le cas où vous rapatriez une icône d'ailleurs (hors maki et temaki qui sont déjà bien optimisées) ou si vous créez une nouvelle icône :

• Dans Inkscape, dans Edit/Preferences/Input/Output/SVG Output, diminuez la précision numérique : autour de 4 devrait être suffisant (à voir en fonction de la taille du canevas)
• Enregistrez votre icône en faisant Save As puis en choisissant le format Optimized SVG pour éviter les tags inutiles qui grossissent inutilement le fichier. Vérifiez en ouvrant le fichier dans un éditeur de texte.

Les icônes OsmAnd sont blanches, pas facile à voir dans un explorateur de fichier. Lors du passage dans Inkscape, profitez en pour la remettre en noir. Ce n'est pas obligatoire (car cartes gère les 2 cas lors de la génération des icônes avec fond coloré, quoique il peut y avoir qq bugs lors de la conversion) mais ça sera plus pratique à consulter si toutes les icônes sont cohérentes.

Stockage

Les fichiers svg bruts des icônes sont stockés dans /public/icons.

Si le nom du fichier correspond à une valeur de tag, vérifiez la concordance exacte, dont _ au lieu de -.

Génération des icônes avec fond coloré

Les icônes avec fond coloré (pour affichage sur le fond de carte, dans le menu des catégories, et sur les fiches lieux), ainsi que quelques autres icônes nécessaires pour le fond de cartes, sont lues par l'utilisateur dans le fichier json à l'adresse /svgo/bulk.

Nouveauté déc. 2025 : le json est lu 1 seul fois au démarrage de l'app. (La mise en cache par le navigateur n'est pas suffisante lors de la 1ère utilisation de l'app, ou pour les bot de référencement, car plusieurs appels étaient générés en même temps donc avant que le cache ne soit rempli). En contrepartie, en développement, il est nécessaire de lancer bun run pack-icons après des modifications.

La page /svgo/bulk/check permet(tra) de voir toutes ces icônes d'un coup (avec leur nom, les alias utilisés sur la carte, et les catégories qui les utilisent).

Le fichier json est préparé par le script /app/svgo/bulk/route.ts selon les étapes suivantes :

1/3 Icônes de catégories

• Parcours des groupes de catégories (listées dans /app/categoryGroupColors.yaml) pour avoir la couleur,
• puis parcours des catégories (listées dans /app/categories.yaml et /app/moreCategories.yaml) pour avoir le nom du fichier svg brut,
• puis création de l'icône, en lui attribuant :
  • soit le nom du fichier brut,
  • soit un alias défini dans la propriété icon alias des catégories (quand un même fichier brut est utilisé avec des fonds colorés différents. Ex : cordonnier et vendeur de chaussures)

Remarque : d'autres alias sont créés lors de la lecture de /svgo/bulk pour chargement des icônes sur le fond de cartes, voir ci-dessous.

2/3 Icônes hors catégories

Dans l'item not in categories de /app/imageRedirects.yaml sont listées d'autres icônes qui doivent être créées en rajoutant le fond coloré (du moins gris) de la catégories Divers.

3/3 Icônes sans fond coloré

Dans l'item small de /app/imageRedirects.yaml sont listées d'autres icônes qui doivent être créées sans fond coloré, pour être affichées en plus petit sur le fond de carte.

Chargement des icônes sur la carte

Les icônes sont chargées sur le fond de cartes (quand le fond est base ou hybrid) par l'effet /app/effects/useMapIcons.ts :

• lecture de l'item in categories de /app/imageRedirects.yaml pour récupérer la liste des cas où il y a besoin de faire une correspondance entre le nom de l'icône, et le nom de la (sub)class OpenMapTiles utilisée dans les tuiles. (ex : utilisation de l'icône tree pour les class park et garden)
• puis parcours de cette liste et du json /svgo/bulk (contenant lui même les 3 types définis ci-dessus) pour ajouter toutes les icônes sur la carte, avec le préfixe cartesapp- pour éviter les conflits avec d'autres sprites.

Comment contribuer aux icônes ?

Après avoir lu les explications et consignes ci-dessus :

• stockez les fichiers bruts dans /public/icons
• pour un affichage sur le fond de cartes, listez l'icône :
  • dans /app/categories.yaml et /app/moreCategories.yaml si c'est pour une catégorie (voir la page wiki sur les catégories #918)
  • dans /app/imageRedirects.yaml si c'est une icône non utilisée pour une catégorie

Merci !