Add a map to a project page (Map module)

The Map module shows an interactive map right on your project page. Use it to show where your project happens, so visitors can explore it themselves. With the Map module, you can:

• frame the area visitors see when the page opens;
• import your own map layers, such as zones, routes or sites;
• let visitors zoom, search for an address and turn each layer on or off.

In this article

• Add the Map module
• Set up the map
• Import map layers
• Add buttons below the map
• What visitors see
• Move or delete the module
• Troubleshooting

Add the Map module

1. Click List of Projects in the left menu, then open your project.
2. Open the Modules tab.
3. Click the + button above the Modules table.
4. In Create a module, choose Map as the Type. The Title is filled in for you; change it if you like, in every language of your project.
5. Click Save. The module's settings open.

New modules are added at the bottom of the page. You can add more than one Map module to the same page.

Set up the map

On the module's General Information tab:

1. Check the Title, and add a Description if you want text above the map.
2. Under Initial map view, use the +/- buttons and drag the map until it shows the area you want. Visitors see exactly this view when the page opens. They can zoom in and move around inside it, but they can't zoom out further or leave the area.
3. Under Map Style, choose Streets (the default), Outdoors, Light or Satellite.
4. To remove the address search box from above the map, turn on Hide the address search above the map.
5. To give the module a coloured background so it stands out on the page, turn on Highlight.
6. Click Save.

The map appears on the project page only once you've set the initial view. Click Preview at the top of the page to check it.

Import map layers

Layers are your own map data, drawn on top of the map: a construction zone, a bike route, the sites of a project. Export them from your mapping software (often ArcGIS or QGIS) as a GeoJSON file in WGS 84 (EPSG:4326).

1. On the General Information tab, click Import a layer.
2. Choose your GeoJSON file (.geojson or .json). The layer is added under Map Layers and saved right away.
3. The layer is named after the file. Change its Name in each language of your project: visitors see this name.
4. Check Visible to show the layer when the page opens. Uncheck it to start with the layer hidden: visitors can still turn it on.
5. Click Save.

Import one file per layer. To remove a layer, click its delete icon, then confirm.

Importing or deleting a layer saves the module right away. If you have unsaved changes, you're asked to confirm first, so save your other changes before you import.

Colours. Layers are blue unless your file sets its own colours. To choose them, add styling properties to the features in your file (such as fill, stroke or marker-color) before you export it.

Add buttons below the map

On the module's Buttons tab, you can add up to two buttons below the map, Primary and Secondary. Turn a button on, enter its Text, and choose a Link Type: a URL, or another module on the page (Project Module). Then click Save.

What visitors see

Visitors see the module's title, the description and the map, followed by your buttons. Anyone can view the map: no login is needed. On the map, visitors can:

• Zoom and move around inside the area you framed.
• Search for an address inside that area, unless you've hidden the search box.
• Open the Layers panel to turn each of your layers on or off.
• Go back to your initial view with the Reset map view button.
• Open the map full screen.

Visitors can't add markers, comment, or click a feature on the map to see more about it. To do this, add an Interactive Map question to a consultation: see Add an Interactive Map question.

Move or delete the module

On your project's Modules tab, use the arrows in the Display Order column to move the module up or down the page.

To delete it, open the module's Actions menu, click Delete, then confirm. The module and its layers are removed for good.

Troubleshooting

The map doesn't show on the project page.
The initial view hasn't been set. Open the module, move or zoom the map under Initial map view, then click Save.

A layer won't import.
The file isn't valid GeoJSON. Export the layer again from your mapping software, choosing the GeoJSON format.

A layer imports, but it's missing or in the wrong place.
The file is probably in another coordinate system. Export it again in WGS 84 (EPSG:4326).

The address search finds nothing.
The search only looks inside the area you framed. An address outside it won't be found.

Participants can't place markers on the map.
The Map module is for viewing only. To collect locations from participants, add an Interactive Map question to a consultation.

Need help? Write to us at support@cocoriko.org.