You can add dynamic maps directly into your prototype from Google Maps and Mapbox, great for creating a more realistic experience for your end-users.
How to embed maps in Marvel:
- Hover over any image in your project
- Click Prototype
- Select any existing hotspot or click and drag anywhere on the image to draw a new hotspot
- Click Link to URL or embed
- Select Embed in the drop-down menu
- Paste your embed code from Google Maps or Mapbox
- Click Save
Where to find the embed code on Google Maps
- Click on a pin
- On the left-hand sidebar click Share
- Click Embed a map
- Click Copy HTML
- Paste the code into Marvel
Where to find the embed code on Mapbox
- Go to Mapbox Studio
- Click Share
- Copy the Share style URL
- Paste it into the iFrame template below, replacing the bold text
<iframe src='/path/to/your/file.html' width='100%' height='400px'>
</iframe>