[[TranslatedPages(revision=9)]]
= Inclure des images dans les modèles de rendu des cartes =

== Image-URL ==
Il existe différentes manières pour référencer les images dans les modèles :

 Images intégrées:: Vous pouvez référencer les images intégrées. Pour parcourir les icônes disponibles, décompressez le fichier `josm-*.jar` avec n'importe quel programme capable de gérer une archive zip. Les fichiers images sont situés dans le sous-dossier `images`. Omettez le premier dossier dans le chemin du fichier (pas `images/presets/food/restaurant.svg`, mais `presets/food/restaurant.svg`). Exemple :
{{{#!mapcss
node[amenity=restaurant] {
    icon-image: "presets/food/restaurant.svg";
}
}}}

 Images locales:: Fournir le chemin d'un fichier image sur le système de fichiers local, soit absolu ou relatif au fichier `.mapcss` courant. Exemple:
{{{#!mapcss
node[amenity=restaurant] {
    icon-image: "/home/username/osm/my-restaurant.png";
}
}}}
 ou
{{{#!mapcss
node[amenity=restaurant] {
    icon-image: "my-restaurant.png";
}
}}}

 URL d'une image sur un serveur distant:: URL complète d'une image sur le web. Assurez-vous que les liens directs sont tolérés par le propriétaire du site Web. Les images sont chargées à la demande et mises en cache sur l'ordinateur du client (pendant une semaine, en général).
{{{#!mapcss
node {
    icon-image: "https://upload.wikimedia.org/wikipedia/en/9/9d/Commons-logo-31px.png";
}
}}}

 Images dans une archive zip:: Il est possible d'emballer votre modèle et toutes les ressources nécessaires dans une archive zip, afin de simplifier la distribution. Lorsque l'utilisateur charge le fichier zip comme modèle, JOSM détecte automatiquement le fichier `.mapcss` dans l'archive et trouve toutes les images.
{{{#!mapcss
node {
    icon-image: "image/file/within/archive.png";
}
}}}

 Données de l'image incorporée:: `data:`-URL selon [http://www.ietf.org/rfc/rfc2397.txt RFC2397]. Exemples:
{{{#!mapcss
node {
    icon-image: "data:image/png;base64,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";
}
}}}
 ou
{{{#!mapcss
node {
    icon-image: "data:image/svg+xml,<svg><rect x='10' y='10' width='50' height='20' fill='white' stroke='blue' stroke-width='2px'/><line x1='18' y1='37' x2='50' y2='5' stroke='black' stroke-width='1.5px'/></svg>";
}
}}}

 Images dans le wiki OSM:: Les fichiers images du wiki OSM peuvent être liés de manière spéciale. Ceci est censé être compatible avec le l'attribut `wiki:symbol`, voir [osmwiki:DE:Hiking DE:Hiking]. Exemple:
{{{#!mapcss
node {
    icon-image: "wiki://Symbol_Jakobsweg.png";
}
}}}


== Les formats d'image ==
=== Les formats Raster ===
JOSM peut afficher les formats raster suivants : `png`, `jpeg`, `gif` et `bmp`. \\
(En gros, tous les formats qui sont pris en charge par Environnement d'exécution Java ''JRE'')

=== Les formats vectoriels ===
Il existe également un support intégré pour les ''scalable vector graphics'' (`svg`). Les icônes svg sont préférées aux icônes au format raster en raison de leur mise à l'échelle sans perte sur les écrans hidpi. La plupart des images `svg` devraient être rendues correctement, mais dans certains cas le résultat peut être imparfait. Ceci est dû aux limitations de la [https://svgsalamander.java.net/ bibliothèque svg] utilisée.

Une chose dont vous pouvez être sûr, c'est que le rendu est le même sur tous les systèmes. Donc, soit le résultat est correct, soit il ne l'est pas.

Si ce n'est pas le cas, essayez de "simplifier" le `svg` de manière à ce qu'il puisse être traité par JOSM. Voir aussi les conseils relatifs aux svg dans la [wikitr:/DevelopersGuide/DefaultPresets#NewIcons directive sur les nouvelles icônes].


== Voir également ==
* La version originale de cette page en [wiki:/Help/Styles/Images anglais]


----
Retour aux [wikitr:/Styles Modèles de rendu de cartes JOSM]