Difference between revisions of "DataURI"
m |
|||
Line 11: | Line 11: | ||
==== Schema ==== | ==== Schema ==== | ||
− | The | + | The <code>data:</code> part specifies that this is a Data URI. |
==== Mime type ==== | ==== Mime type ==== | ||
− | The | + | The <code>image/png</code> part specifies that this is a PNG image. Also supported is <code>image/jpeg</code>. |
===== base64 ===== | ===== base64 ===== |
Revision as of 12:14, 20 March 2018
Instead of referring to an image included in an add-on, an image path may also contain the image directly as a Data URI (wikipedia). This can be useful for add-on icons in the PblWML (which may otherwise only contain core images) or for single-file scenarios.
Beyond these cases, Data URIs are less useful, as they are larger than the images themselves, and clutter up the files that include them.
Contents
Format
A Data URI appears as follows: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
It can be split into the following sections:
data
image/png;base64
iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==
Schema
The data:
part specifies that this is a Data URI.
Mime type
The image/png
part specifies that this is a PNG image. Also supported is image/jpeg
.
base64
Technically part of the mime type, this specifies that the image data is encoded using Base64.
Data
The random-looking characters following the comma are the actual image data.
Creating a Data URI
Wesnoth does not yet support generating a Data URI for you, but there are alternatives.
Websites
There are a large number of Data URI generator websites. Googling for data uri generator will find them.
Manually
Creating a data URI by hand can be accomplished by taking your image, Base64-encoding it and formatting it as shown above.