How to make an interactive map with pins
- Nan Zhou
- Aug 28, 2023
- 2 min read
Updated: Apr 2
So you already have your location data nicely stored in Excel, CSV, Airtable, Google Sheets or Webflow CMS, now you want to make an interactive pin map with it so you can visualise your data or use it for your website - Is there an easy way to do this, and without coding?
Yes you can.
In this post, I will show you how you could convert your location dataset into a custom interactive pin map that will blend in seamlessly with your website, in minutes and without coding.

With No Code Map App, you can create an interactive map from your data in 3 easy steps.
Choose a template from our list of templates.
Copy & paste your data from your spreadsheet or integrate your database (works with Google Sheets, Airtable and Webflow CMS).
Customise your map to your preferred colour, font, style, map filters, calls-to-action, and add media and other settings.
Step 1
You can choose from our list of 6 ready-to-use map templates, all designed and built based on popular use cases and leading industry designs:
1. General
2. Timeline
3. Event calendar
4. Restaurant
5. Product locator
6. Property

Step 2
Once you have loaded the template, now you can feed in your data. In "Data" section, you can import your data in 4 different ways:
Copy and paste from your spreadsheet
Sync with Google Sheets
Sync with Airtable
Sync with Webflow CMS
If you are syncing your database, then you can also setup auto-data sync which means you won't have to sign back in to update your map data.

Once your data has been imported, you will see a screen where you can select which data fields from your dataset you would like to use for your map.

Our builder will then automatically map your data and everything will be auto-generated, including image, audio, map filters, calls-to-action etc.
Step 3
Now the fun part - customise your map! And it is super simple, all you have to do click and click, no coding and no drag and drop.
You can customise almost everything on your map, including side bar list view, map filters, pop up box, calls-to-action, colour, font, marker, zoom level, language translation and more!

That is it! You are done.
You can embed your map by using the embed code we provide. You can embed your map anywhere on the web.

Please give it a try!
Nan
Comentários