Creating a Custom Map

Owned by Karen Hogan (Unlicensed)
Last updated: Nov 29, 2021
2 min read

On the ‘Edit, Chart’ screen, click the ‘Chart’ tab and choose ‘Custom Map' from the list of chart types.

To create a Custom Map, you will need to add the following information on the Data tab:

  • SVG URL

  • Mapper ID

  • Identifier

  • Label

  • Detail

The SVG URL can be any of the following:

  • URL to an SVG

  • A default SVG file located in the dashboard. Default SVGs currently include a map of the United Kingdom, a map of the USA, front human body and back human body. These can be accessed using the following paths: united-kingdom-regions.svg, usa-full-states.svg, human-muscles-front.svg, human-muscles-back.svg

The Mapper ID is the attribute within each point of the SVG which provides the unique identifier.

For the default SVG’s, the mapper ID is ‘id’.

The Identifier is the unique ID for each section of the SVG.

The Label is the name for each section and Detail provides the value.

The dashboard ships with sample SVG images, which can be found in the SVG folder in the dashboard directory. These include the human body, USA states and UK regions.

This table provides an example of the data used to draw a Custom Map.

The following screenshot is the Custom Map created from the table of data shown above.

If you need some guidance in creating an SVG, please have a look at this page.