Last change: August 24, 2020

Current version: 1.6.2

The googleMaps module provides your website with the options in the Google Maps javasript API, but simplyfied.

To use the googleMaps module you first use thei connect optiono to create and display a map. You can then use the send option to perform tasks on this map.

syntax (collect)

webanizr.collect('googleMaps', parameters, callback)

parameters

The googleMaps module accepts the following parameters:

key__api (required)

Your Google Cloud API Key. You can get your own Google Cloud API key here.

id__dom (required)

The id of the dom element that will function as a wrapper for the Google Map.

latitude__location (required)

The latitude of the location you want to center the map on.

longitude__location (required)

The longitude of the location you want to center the map on.

level__zoom (required)

The zoom level used when displaying the map.

id__map (optional)

If you want to perform actions on the map you need to give the map an id using this parameter. You then use this value in the send method to target this map.

callback__error (optional)

A callback function to be called when the module is unable to calculate the route. It receives the error in the form { message__error : "the error message" }.

zoom__controls (optional)

Boolean to either show or hide the zoom controls on the map.

maptype__controls (optional)

Boolean to either show or hide the map type buttons on the map.

scale__controls (optional)

Boolean to either show or hide the scale option on the map.

streetview__controls (optional)

Boolean to either show or hide the streetview button on the map.

fullscreen__controls (optional)

Boolean to either show or hide the fullscreen button on the map.

mode__poibusiness (optional)

Boolean to either show or hide the points of interests of type 'business' on the map.

text__marker (optional)

If a text is supplied in this value, a marker will be placed in the center of the map. The text will be used as hint text.

animation__marker (optional)

Can be used in combination with text__marker. This parameter sets the animation of the shown marker. Valid options are:

• drop
• bounce

callback

The callback is called after the maps is shown on the page. 

syntax (send)

webanizr.send('googleMaps', data, parameters, callback)

data

The data needed to perform the requested action.

parameters

The send method of this module accepts the following parameters:

id__map (required)

The map you want to target. The value must match the value given to id__map in the collect method.

type__action (required)

The type of action you want to perform. The following values are supported:

showroute

The showroute action plots a route on the targeted map. To calcalate the route it looks for the key "points__route" in the data. The value for this key should be an Array containing all the stops of the route.

geocoding(shouldn't be used on production)

Adds geocoding.

addmarker

Adds marker to an existing map. Can be used multiple times to add multiple markes to the same map. Possible parameters are:

latitude__marker: Latitude of the marker

longitude__marker : Longitude of the marker

(optional) content__markerinfo : Content inside the marker window. Can be set to any html.

(optional) title__marker: The text to show when the marker is hovered over with mouse.

clearmarker

Clears all the markers from a map.

setzoom

Sets the zoom level. Parameter to use : 

level__zoom

callback

The callback is called when the action on the map is performed.

demo

Show a map:

https://cdn.cpmodules.webanizr.com/demo/google-maps/index.html

Show a route:

https://cdn.cpmodules.webanizr.com/demo/google-maps-route/index.html

Link to play with with all possible map options and generate config file:

https://mapstyle.withgoogle.com/

Changelog

• August 24, 2020: 1.6.2 - fixed typo
• August 21, 2020: 1.6.1 - added callback function to clearmarker and addmarker
• August 21, 2020: 1.6.0 - addmarker, clearmarkers and setzoom added to send method
• August 20, 2020: 1.5.0 - geocoding functionality added to send method
• December 5, 2019: 1.4.2 - changed mode__poi to mode__poibusiness
• December 5, 2019: 1.4.1 - changed dataname show/hide poi option
• December 5, 2019: 1.4.0 - added show/hide poi option
• November 15, 2019: 1.3.0 - added marker options
• November 15, 2019: 1.2.0 - added control options
• October 9, 2019: 1.1.0 - added callback on error parameter
• October 28, 2019: 1.1.1 - enabled the callback for the collect function
• October 28, 2019: 1.1.2 - callback gives map id back