How can I create an interactive map?

This documentation is always evolving.

This article focuses on Mapcreator Next and its features. For details about the previous version of Mapcreator, click here.

To provide a more engaging experience for your users, you can make your web maps interactive. You can add pop-ups with text, images, or videos that appear when users interact with map elements. 

Pop-ups can be assigned to polygons, lines, routes, icons, text, and other elements you have added to the map. To do this, click on the added element and go to the ‘’Pop-up’’ tab in the menu at the top right. Here, you can enter the content for the pop-up.

Image

To add a picture to your popup, click on the ‘’+ Add media’’ and paste the image URL in the ‘’Image source’’ field. Please note that you can only add a published image, not one uploaded from your computer. In the ‘’Target link’’ field, you can add a hyperlink for the image, which users will be directed to when they click on the image. 

Video

Click on ‘’+ Add media’’ and paste the YouTube link. Here, you can also toggle additional settings for the video.

Text
Enter the text in the ‘’Main content’’ section, then navigate to the ‘’Text options’’ tab to adjust the font and other text settings. If you want to add a hyperlink, simply highlight the text and click the link icon to insert the URL. 

Imported data

Some elements available in the tool contain data. For example, country polygons may include details like the name, ISO code, and other attributes. Similarly, imported data, such as a GeoJSON file or other supported file formats, can also contain additional details. If an element includes data, you can click on ‘’Imported data’’ (the button with the table icon) to view all available columns. Click on a column to insert the corresponding value. Please note that you can customize its font the same way as regular text. 

Pro-tip: If you know the name of the column, you can use a shortcut by adding the column name after the $ symbol. For example, you can add the ‘’World’’ group via the ‘’Area’’ menu, open its ‘’Pop-up’’ menu, and write $name_en. This will display a pop-up with the correct name in English when a user clicks on a country. 

Once you have finished creating pop-ups, navigate to ‘’Export’’ and select ‘’Interactive’’ to generate a link for your map. In the export menu, you can customize your map. For example, you can choose the popup position, restrict panning, or add controls (buttons to reset the map, zoom in, geolocate, or switch to full screen). The map preview is interactive as well. It allows you to fine-tune the settings and instantly see the updates.