Icons

To build intuitive user interfaces, you can use icons in addition to textual descriptions. Therefore map.apps provides a variety of icons based on a web font.

These can be used in different ways through:

  • configuring the iconClass property for a toolset or tool in an app.json.

  • setting the iconClass property for a tool you define in a bundle

  • adding the icon’s name as class attribute to an HTML element in a custom widget template

  • setting the content attribute accordingly for a custom HTML element

The map.apps IconFont Gallery provides a quick reference on the available icons, their names and their content attributes value.

In addition to the map.apps specific icons, the Material Design Icons can be used. map.apps provides additionally prepared CSS classes that can be used by adding material-icon- to the icons name. E.g. to use the icon "Sports Score" as tool icon add iconClass: "material-icon-sports_score" in the tool’s configuration.

The bundle font-mapapps is responsible for providing the web font. It is loaded automatically with any map.apps layout theme.