Creating and Adding Custom Maps in VoxDash

​

Overview

VoxDash allows users to add custom geographic maps for advanced data visualization and analytics. If the map you need is not available in the default VoxDash map library, you can create and import your own map using GeoJSON data from Highcharts Maps or by building a custom SVG map and converting it into a Highcharts-compatible format. This guide explains how to:

• Find and download existing geographic maps.
• Import GeoJSON maps into VoxDash.
• Create custom maps for non-standard regions.
• Convert SVG maps into interactive Highcharts maps.
• Use custom maps in VoxDash dashboards and reports.

​

Option 1: Import GIS Maps into VoxDash

If your map data is stored in GIS formats such as ESRI Shapefile, KML, or other standard mapping formats, you can convert it to GeoJSON, which is fully supported by VoxDash and Highcharts Maps.

​

Convert GIS Data to GeoJSON

A GIS editor such as QGIS (free and open-source) can be used to:

1. Import your map data (Shapefile, KML, etc.).
2. Select and edit the required geographic areas.
3. Reproject the map if necessary.
4. Simplify complex geometries to improve performance.
5. Review and update map attributes.
6. Export the final result as a GeoJSON file.

​

Edit Existing Highcharts Maps

The Highcharts Maps Collection is available in:

• GeoJSON
• TopoJSON
• SVG

These files can be modified using compatible editors such as QGIS, Inkscape, or a text editor before importing them into VoxDash.

​

Import into VoxDash

1. Export your map as GeoJSON.
2. Go to Data Provider → Maps in VoxDash.
3. Click Add New Map.
4. Upload or paste the GeoJSON content.
5. Save the map.

Tip: Simplifying map geometry before exporting can significantly improve map rendering performance and dashboard loading times.

For more detailed structure read this document.Highcharts Maps – GeoJSON Collection

​

Add the Map to VoxDash

1. Navigate to Data Provider.
2. Open the Maps section.
3. Click Add New Map.
4. Upload or paste the GeoJSON content.
5. Enter a name and description for the map.
6. Save the map.

Learn more about Adding new map The map will now be available throughout VoxDash for dashboards, reports, and visual analytics.

​

Option 2: Create a Custom Map

​

Step 1: Create a Custom Map

If the required map is not available in the VoxDash map library, you can create your own custom map using Inkscape and the Highcharts Map Converter.

​

Requirements

Before you begin, install:

• Inkscape (free SVG editor)
• A reference image (PNG or JPG)
• Access to the Highcharts Online Map Converter

​

Step 2: Draw the Map

1. Open your reference image in Inkscape.
2. Select Draw Bezier Curves and Straight Lines (Shift + F6).
3. Trace each region by drawing a closed shape around its boundaries.
4. Apply a solid fill color to every region (Fill and Stroke panel).
5. Open Object → Object Properties and assign:
   • ID – unique region identifier
   • Label – region name
6. For neighboring regions, enable Snap to Path to ensure borders align correctly.

​

Special Cases

• Islands: Group the mainland and islands together (Object → Group) and assign a single ID and label.
• Enclaves: Draw the outer region first, reduce its opacity, then draw the enclosed region.
• Separator Lines: Draw lines without a fill color. These will be treated as map separators rather than regions.

​

Step 3: Convert the Map

1. Save the file as SVG.
2. Open the SVG file in a text editor and copy the SVG markup.
3. Open the Highcharts online SVG-to-Map Converter tool.
4. Paste the SVG markup and click Load.
5. Verify the map preview.
6. Select View Data and copy the generated JSON.

For more detailed structure read this document. Highcharts Maps – Custom Maps

​

Step 4: Import the Custom Map into VoxDash

1. Navigate to Data Provider → Maps.
2. Select Add New Map.
3. Paste the generated map JSON.
4. Provide a map name and description.
5. Save the map.

The custom map is now available for use across VoxDash. Learn more about Adding new map

​

Summary

VoxDash supports both pre-built and fully custom maps. Users can either import existing GeoJSON maps from Highcharts or create entirely custom geographic regions using Inkscape and the Highcharts Map Converter. Once imported, these maps can be used to build interactive geographic visualizations, perform regional analysis, and display business metrics directly within VoxDash dashboards.