Maps Locator

 
Version
1.0
Compatibility
J4.X
M
Release date
January 2020

€ 15

The JModules maps locator allows you to visualize your presence using google maps.

This module enables you to set several markers based on addresses on a google map. Very useful if you want to show your shops, or your offices on a map. You can set the marker, width, height and per pointer, there are serveral ways to populate the marker's popup.  The map automatically zooms to the markers reach.

What kind of real-life cases can you think of?

  • show the locations of your shops
  • show the locations of your events
  • show the locations of your equipment

Check below for an example!

 

  • HQ

    Herengracht 12
    Amsterdam
    Netherlands
    +31 111 11 1111
    Directions
  • Branch Office

    Du Perronstraat 1
    Amsterdam
    Netherlands
    +31 111 11 1111
    Directions
  • Marketing

    Jan Ringelstraat 12
    Amsterdam
    Netherlands
    +31 222 22 2222
    Directions
  • Finance

    Meeuwenlaan 20
    Amsterdam
    Netherlands
    +31 333 33 3333
    Directions
  • Import

    Lange voorhout
    Den haag
    Netherlands
    +31624759222
    Directions

  • mb avatar 4frontend: search address
  • frontend: get directions from your location
  • frondend: all google maps features
  • set Google maps API Key (required)
  • set height in pixels
  • set custom marker icon
  • set popup widht and height
  • set maptype
  • mobile ready
  • choose layout, with or without address bar
  • various language settings to customize the module to your needs
  • varouse color settings, to met the module blend in with your template
  • per location: name / street / zip+ city / country / phone / extra / link. All fields are optional, and no label is shown, making them usable for all kinds of data.

 

 

You need a working Google maps API key from google for this module. How to get one is described here.

  1. Go to https://developers.google.com/maps/documentation/javascript/get-api-key and follow the steps. 
    You need to add billing details!
  2. Create a project
  3. Get your credentials (this is the code you have to enter for the module to work)
  4. Once you have this, add the following API's to the credentials or the module will not work:
    - Geocoding API
    - Maps Javascript API
  5. Once this is setup, it should work. 
  6. Optionally you could restrict your project, to certain websites. I would advise you to do so.