9 Aug 2019

#65: Google Maps Location Picker with markers and radius

Need a location picker field to save coordinates in your database? Do you want to just display a business location on a map for your site visitors? This is the simple video tutorial to show the best tool for doing all the above

A while back we released a video tutorial showing you how to implement a Google Maps and show multiple markers on it(see the previous video here). Here is an easier way of achieving that with just a couple clicks.

What's needed?

  • the best dnn online form builder module (of course Action Form)
  • a couple minutes to set it up
  • an api key from Google

Getting started

First, you need to add an Action Form module to the page where you plan on using it and then go to form's admin page, click add field and select the Google Maps field.

Make sure you get your needed API key from Google and you're all set

Does it work as a Location Picker?

Yes, the Google Maps Action Form field allows your users to select a point (or more) on the map which on submit are translated into GPS coordinates (latitude and longitude) so that you can store them in the database for later use. You can read more about it in the documentation here.

Can I display multiple locations on a map?

Yes, you can display one or more locations on a map. Starting with Action Form version 5.0.656 the marker parameters can also be provided as tokens.

Also, starting with the above mentioned Action Form version you can also render a radius (circle) on the map in order to delimit an area in which maybe your business provides service or coverage.

Have a look at the video tutorial and make sure you put it in practice for your future custom projects. If you have more complex scenarios to be implemented like calculating the distance between two markers (locations) you can simply book our Implementations Team to help you with the project.

Latest Posts from 1001

29 Aug 2019

#66: Manipulate Cookies with MyTokens

9 Aug 2019

#65: Google Maps Location Picker with markers and radius

16 Jul 2019

#64: How to Build a File Manager