-
Notifications
You must be signed in to change notification settings - Fork 15
Using your own icons
If you wish to use your own icons you can place them in the icons/user directory. Icons can be PNG or SVG format, and possibly others too. A good choice of size is about 256px, though if you don't use the desklet at large zooms you could reduce this somewhat (the large current conditions icon is displayed at 170px high at 1.0x zoom).
Changes to the icons in icons/user take effect at the next refresh. Changes to iconmeta.json (see below) take effect when there is change to the Weather Desklet's configuration that affects styling.
The file iconmeta.json contains information about the icon set that the Weather Desklet needs. You will probably need to create and edit this - it must be valid JSON so pay careful attention to the commas! The file iconmeta.json.dist provides a template that you can copy to iconmeta.json. You can also find various examples in the extra directory. Default values will be applied if the file is missing or can not be parsed, or if any values are missing.
The format is:
{
"ext": "png",
"aspect": 1,
"adjust": 0.9,
"map" : {
"01" : "03",
"02" : "03",
"26d" : "26"
}
}
the file extension used for the icon filenames, without the dot. png and
svg are known to work. The default is png.
The aspect ratio of the icons, ie the width divided by the height. For square icons this will be 1. For icons that are 170px wide and 120px high this will be 1.4167. The default is 1 (ie square icons).
A value to adjust the size of the icon by. The value represents the proportion of the container size that the icon should be scaled to. It is useful in cases of icon sets that have no inbuilt padding, ie the design comes right to the edge of the image file. By setting this value to, for example, 0.88 then the icon will be made slightly smaller than its container, and displayed in the centre of the container. The size of the large current conditions icon container at 1.0x zoom is 170px. With a value of adjust of 0.88 the icon will be scaled to about 150px, leaving 10px of space all around it. The default value is 1 (ie do not adjust). Note that values of greater than 1 will have no effect.
map is a javascript object that maps the codes used by the Weather Desklet to icon file names (without the extension). The default is empty, which means no mapping, file names are expected to match Weather Desklet codes. See below for more details on how icons are selected. The map object is useful for avoiding having to have multiple copies of the same icon, each with a different name. It can also be used to allow you to keep descriptive filenames, rather than codes. For example, rather than name an icon for fog 20.png, name it fog.png and include
"map" : {
"20" : "fog"
}
When the Weather Desklet needs to display an icon it goes through the following process:
- Lookup the code in the map for the current icon set.
- If it finds a match, attempt to display the icon of the name returned
- If it doesn't find a match, attempt to display an icon with the same name as the lookup code.
- If the icon it is attempting to display is not present, switch to the default icon set and repeat the process
An example: You have the following map:
"map" : {
"01" : "03",
"02" : "03",
"26d" : "26"
}
In your directory you have files:
- 02.png
- 03.png
- 26.png
- 39.png
For code 01 the desklet displays 03.png, because 01 maps to 03.
For code 39 there is no map, so the Weather Desklet displays 39.png.
Code 02 maps to 03, so 03.png is displayed. The presence of a file named 02.png is ignored.
For code 47 the desklet attempts to display 47.png, but can not find it, so displays 47.png from the default icon set.
The file icons.html displays all the icon sets, including the user defined
set, alongside the codes and descriptions. It honours the mapping. Please
note that it doesn't display fallback to the default icon set - missing
icons / mappings will appear as blank spaces.
See also the list of icon codes