Custom map pins

From Resco's Wiki
Jump to navigation Jump to search

Resco mobile apps can include maps. Records with location information can be displayed on the map as pins. By default, they look like this:

default map pins in the app

You can customize map pins for various records based on field differences, which can significantly enhance the visualization of data on maps. Custom map pins are easily set up through the View Designer feature.

  1. Edit an app project in Woodford.
  2. Select the entity where you want to use custom map pins.
  3. Click Show UI and edit the view.
  4. Select the row design and click Add Map Pin.
  5. A new icon appears next to the row design name. Click it to configure map pins.

custom map pin on the view

There are three main types of bindings available for custom map pins, allowing for a range of customization options:

  • Constant Binding: This option utilizes a single map pin image for all the selected records. To apply this, choose an image from the image folder to represent all records uniformly on the map.
  • Value Binding: This option allows the creation of custom map pins based on the name of options within an option set field.
  • Raw Value Binding: Similar to Value Binding, this method defines the map pin based on the logical value of options within an option set field.

configure map pins

For both Value and Raw Value bindings, it's necessary to select an option set field as the basis for differentiating the records. After selecting the appropriate field, choose a style that specifies how the map pins should be formatted. The chosen style must be either ImageCellStyle or its child.

When you finish configuring and add a custom map pin to the row, it's displayed above it.

Example: Custom map pins for active and inactive accounts

In this example, we add custom map pins for the account entity and differentiate between the active and inactive accounts.

First, we have to define the style for the map pin.

  1. Go to the Account entity and open a view used in the map.
  2. In the style editor, click Add while ImageCellStyle is selected. This creates a new child style. We name it "MapPin".
  3. The format string is defined as follows: Map_pins.{0}.png.
    "Map_pins" refers to the folder where the map pin images are stored.
    The following part ".{0}" represents the value. This is a placeholder for the map pin types mentioned above. It's either for Value or Raw Value.
Note Styles are global; you can use this style also for other pins on different views.

Style we define for the custom map pins

The next step is to add the map pin to the view.

  1. Click Add Map Pin and click the pin.
  2. Set Type to "Raw Value".
  3. We want to differentiate the records by their status code. Therefore, set Field to "statuscode".
  4. Set Style to "MapPin".

configure map pin window Raw value

The last thing we have to set up is the images.

  1. Go to Images and create a new folder "Map_pins".
  2. Upload two images representing the map pins. The name of the Images should be the logical value for the respective status code. In our use-case, "0" is for active and "1" is for inactive.

upladed map pins in the images folder

This is what the result looks like in the app:

custom map pins in the app

More options

In the configuration of your app project, in the Map, GPS tab, you can set additional options related to map pins and their behavior:

Map Pin Aggregation
Enabling map pin aggregation is useful when multiple records are located in the same area. Cluster pins group records based on the zoomed area and prevent the map from looking cluttered.
Map pin aggregation can be configured in Woodford configuration menu as a project-wide behavior or for the specific map in map setup.
Map pin aggregation
Map Pin Expansion
(iOS) Allow the pin expansion on the map (show contact details for related record)