How to Configure an Icon for a Layer

This section explains how to configure an icon for a layer.

Each icon contains a set of two images, which may be the same or not: the icon to represent the layer itself in the Layers window, and the icon to represent the objects this layer contains. For layers displaying maps, only the icon representing the layer will be used, and any other information provided will be disregarded. While icons represent the layer itself and also individual objects on the map, a cluster icon may be used on the map indicating when there is more than one object in the same location.

You can also configure icons to be changed dynamically based on the values of certain object properties. To configure this feature, the names of the images to be used must contain the possible values of the property, indicating which image will be used for each value. For example, if the icon is being configured to change according to the status of an object, for which the possible values are 1, 2, and 3, the names of the icon images could be "icon_1", "icon_2", and "icon_3". Then, in the XML file, the variable name of the field can be entered in the path to the image, between double braces (for example, icon_{{StatusEnum}}.png). When the map is used, this variable will be replaced by the value of the property (1, 2 or 3). If configured correctly, the result of this substitution will correspond to the name of the image to be used. Note that special characters may not be used in the image name and that the name cannot start with a number. For details on the properties that can be used as variables, please contact the support team.

 

Note: The system does not validate icon paths that contain variables. This means that if you import the XML file to the system manually through the Export/Import Layers section, there will be no notification if the path to the icon is invalid.

 

All icons are registered within the Icons group, and each icon is configured in an Icon node, as in the example below.

 

<Icons>

 

<Icon id="ambulance">

      <layerUrl>/Content/img/map-icons/resourceUnits/icon_0_ambulance.png</layerUrl>

      <url>/Content/img/map-icons/resourceUnits/icon_{{StatusEnum}}_ambulance.png</url>

      <retinaUrl>/Content/img/map-icons/resourceUnits/icon_{{StatusEnum}}_ambulance-2x.png</retinaUrl>

      <clusterUrl>/Content/img/map-icons/resourceUnits/icon_ambulance_cluster.png</clusterUrl>

      <clusterRetinaUrl>/Content/img/map-icons/resourceUnits/icon_ambulance_cluster-2x.png</clusterRetinaUrl>

      <size>[26,38]</size>

      <clusterSize>[40,40]</clusterSize>

      <anchor>[4,37]</anchor>

      <popupAnchor>[14,-52]</popupAnchor>

</Icon>

...

 

</Icons>

 

In the XML structure of the icon, the following elements can be configured:

Parameter

Required?

Description

Icon

Yes

Contains the id attribute, which will be used to represent this icon when including it in a layer. Note that icons may not be registered under the same id.

layerUrl

Yes

Path of the image to be used for the icon that will appear in the Layers window.

url

Yes

Path of the image to be used for the icon that will represent the objects in the layer. For this image to change according to the values provided for a certain property of the object, this field must contain the variable of the property to be used, entered between double braces.

retinaUrl

No

Similar to the url, but with image quality for screens supporting RETINA technology.

clusterUrl

Yes

Path of the image for the cluster icon that will be plotted on the map when there is more than one object in the same location.

clusterRetinaUrl

No

Similar to the clusterUrl, but with image quality for screens supporting RETINA technology.

size

Yes

Defines the size, in pixels, of the icon.

clusterSize

Yes

Defines the size, in pixels, of the cluster icon.

anchor

Yes

Defines the part of the icon, in pixels, that will be placed in the exact geographic location of the object (for example, the tip of a pin icon).

popupAnchor

Yes

Defines the position, in pixels, in which pop-ups will be displayed, in relation to the position of their corresponding icons on the map.

 

Note that icons for scheduled events are highlighted on the map when the option to view associated routes or activities is enabled. The same applies to activities if the feature to view associated routes is enabled. The additional configurations below are provided by default for these icons in the "\App_Data\MapQueriesConfig.xml" file.

 

<Icon id="event">

<selectedUrl>/Content/img/pins-

selecteds/icon_event_selected.png</selectedUrl>

<selectedRetinaUrl>/Content/img/pins-

selecteds/icon_event_selected-2x.png</selectedRetinaUrl>

</Icon>

 

In addition, icons for Camera assets are also highlighted by default when the search location feature for a camera is enabled in the window that plays the video feed. The configurations below are also provided by default for each camera icon in the XML file.

 

<Icon id="camera">

<selectedUrl>/Content/img/pins-

selected/icon_camera_selected.png</selectedUrl>

<selectedRetinaUrl>/Content/img/pins-

selected/icon_camera_selected-2x.png</selectedRetinaUrl>

</Icon>

 

The clustering icon can be enabled or disabled. To disable this icon, enter the value -1 in the EnableClustering element in the web.config file. Any other values used in this element will enable the clustering icon. The zoom level for the clustering icon can be defined in the SearchZoom element, which accepts values from 1 to 16. By default, the zoom is set to the maximum level.  

 

IMPORTANT! If the system installation is updated, the XML file must also be updated with the above configurations so that the icons for scheduled events, activities, and cameras are highlighted.

 

The table below explains each of these parameters.

Parameter

Required?

Description

selectedUrl

Yes, for the highlight feature to work.

Similar to the url, but available only for icons for scheduled events, activities, and Camera assets. This parameter is used to indicate that an icon displayed on the map was selected.

selectedRetinaUrl

Yes, for the highlight feature to work.

Similar to the retinaUrl, but available only for icons for scheduled events, activities, and Camera assets. This parameter is used to indicate that an icon displayed on the map was selected.

 

Note: The parameters below can also be added to these icons.

Parameter

Required?

Description

selectedIconSize

No

Similar to the size, but available only for icons for scheduled events, activities, and Camera assets. This parameter is used to indicate that an icon displayed on the map was selected. If this parameter is not used, the size of the icon selected in the selectedUrl will be the same as provided for the size.

selectedAnchor

No

Similar to the anchor, but available only for icons for scheduled events, activities, and Camera assets. This parameter is used to indicate that an icon displayed on the map was selected. If this parameter is not used, the geographic location of the icon selected in the selectedUrl will be the same as provided for the anchor.