| 8 | | You can use web tools to convert your image to the base64 code, e.g. [http://www.base64-image.de base64-image.de]. |
| 9 | | |
| 10 | | ''Before'' you convert your image to the base64 code you should minify it to make the base64 a lot shorter (without loosing quality): |
| 11 | | * for `.png` files: Use e.g. [http://compresspng.com/ compresspng.com]. |
| 12 | | * for `.svg` files: Use e.g. [https://github.com/RazrFalcon/svgcleaner-gui/releases svg cleaner]. When using this one you can use the "complete" preset to clean up the svg file. More information about possible problems with svg in JOSM see [wiki:DevelopersGuide/DefaultPresets#NewIcons]. |
| 13 | | |
| | 6 | * You can use web tools to convert your image to the base64 code, e.g.: |
| | 7 | * [https://www.base64-image.de base64-image.de] |
| | 8 | * [https://base64.guru/converter/encode/image base64.guru] |
| | 9 | * ''Before'' you convert your image to the base64 code you should minimize it to make the base64 a lot shorter (without loosing quality): |
| | 10 | * for `.png` files: Use e.g. [https://compresspng.com/ compresspng.com], |
| | 11 | * for `.jpeg` files: Use e.g. [https://jpegcompress.com/ jpegcompress.com], |
| | 12 | * for `.svg` files: Use e.g. [https://github.com/RazrFalcon/svgcleaner-gui/releases svg cleaner]. When using this one you can use the "complete" preset to clean up the svg file. More information about possible problems with svg in JOSM see [wikitr:/DevelopersGuide/DefaultPresets#NewIcons]. |
| | 13 | * Code structure: |
| | 14 | * {{{data:image/png;base64,...databytes...}}} |
| | 15 | * {{{data:image/svg+xml;base64,...databytes...}}} |
| | 16 | * Real example (paste that code into the address bar of your web browser to see the image): |
| | 17 | * {{{data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAADFBMVEUTPmdaXSdnXUmdcyo9AbYLAAAAFklEQVQI12NYtYqBgYEI4v//0FAiCAA8TB/hMzHkwAAAAABJRU5ErkJggg==}}} |
