Class: map

ajs.maps.gmapdraw. map

This class handles the drawing tools used to draw over a google map and allows the drawed data exportation.

The map manages also some controllers

  • clear map controller
  • export map controller
  • geocoder text field controller
  • tips controller

Moreover every drawing tool has its own controller, which may be specifically set or used in its default form.

Each map controller may be specified custom, may be removed setting the related option to null or used in its default form.

Once instantiated the class and set the tools by options or instantiating direclty the drawing tool classes and adding them to the map, see ajs.maps.gmapdraw.map#addTool, call the render method to render the widget. Then it is possible to continue configuring the widget adding or removing tools, customizing the google map instance which is returned by the ajs.maps.gmapdraw.map#gmap method.

When defining specific map controllers, be sure to make them handle the proper map methods.

Very important: be sure to load the google maps library yourself in the head of the document!

new map

Google maps drawing class, provides tools for drawing over a google map instance, and export drawed data.

Parameters:
Name Type Argument Description
canvas String The id attribute of the map container
options Object <optional>
 A class options object
Properties
Name Type Argument Default Description
center Array <optional>
 new Array(45, 7) The initial map center coordinates, (lat, lng).
zoom Number <optional>
 8 The the initial map zoom level.
tools Object <optional>
 {} The object containing the tool's names and optionsa to be activated when initializing the map. It's a shortcut to easily define set and active tools objects.
Properties
Name Type Argument Default Description
point Object <optional>
 undefined The point tool init object
Properties
Name Type Argument Default Description
ctrl String | Element <optional>
 undefined The id attribute or the element itself which controls the tool, default the built-in menu voice
options Object <optional>
 undefined The tool options object, see ajs.maps.gmapdraw.pointTool for available properties
polyline Object <optional>
 undefined The polyline tool init object
Properties
Name Type Argument Default Description
ctrl String | Element <optional>
 undefined The id attribute or the element itself which controls the tool, default the built-in menu voice
options Object <optional>
 undefined The tool options object, see ajs.maps.gmapdraw.polylineTool for available properties
polygon Object <optional>
 undefined The polygon tool init object
Properties
Name Type Argument Default Description
ctrl String | Element <optional>
 undefined The id attribute or the element itself which controls the tool, default the built-in menu voice
options Object <optional>
 undefined The tool options object, see ajs.maps.gmapdraw.polygonTool for available properties
circle Object <optional>
 undefined The circle tool init object
Properties
Name Type Argument Default Description
ctrl String | Element <optional>
 undefined The id attribute or the element itself which controls the tool, default the built-in menu voice
options Object <optional>
 undefined The tool options object, see ajs.maps.gmapdraw.circleTool for available properties
clear_map_ctrl String | Element <optional>
 'default' The clear map controller (clears all drawings over the map). If 'default' the built-in controller is used, if null the clear map functionality is removed. If id attribute or an element the clear map functionality is attached to the element.
export_map_ctrl String | Element <optional>
 'default' The export map controller (exports all shapes drawed over the map). If 'default' the built-in controller is used, if null the export map functionality is removed. If id attribute or an element the clear map functionality is attached to the element.
export_map_callback Function <optional>
 null The callback function to call when the export map button is pressed. The callback function receives one argument, the exported data as returned by the ajs.maps.gmapdraw.map#exportMap method.
geocoder_map_field Boolean <optional>
 true Whether or not to add the gecoder functionality which allows to center the map in a point defined through an address, or to pass the lat,lng coordinates found to the map click handlers (exactly as click over the map in a lat,lng point).
tips_map_ctrl String | Element <optional>
 'default' The help tips map controller (shows tips about drawing tools). If 'default' the built-in controller is used, if null the tips box is not shown, if id attribute or an element the functionality is attached to the element.
Source:
  • gmapdraw.js, line 94
Example
var mymap = new ajs.maps.gmapdraw.map('my_map_canvas_id', {
	tools: {
		point: {
			options: {
				max_items: 5
			}
		},
		circle: {}	
	}
});

Methods

<protected> addControllersContainer

Adds an empty container over the map which may contain default controllers if any

Source:
  • gmapdraw.js, line 154
Returns:
void

addDefaultCtrl

Adds a controller in the default controllers container

Parameters:
Name Type Description
ctrl Element The controller to be added
Source:
  • gmapdraw.js, line 174
Returns:
void

addTool

Adds a drawing tool

Parameters:
Name Type Description
tool ajs.maps.gmapdraw.tool The tool object
Source:
  • gmapdraw.js, line 213
Returns:
void

clearMap

Clears the map

Source:
  • gmapdraw.js, line 563
Returns:
void

exportMap

Exports the map drawed shapes as data points

Source:
  • gmapdraw.js, line 600
Returns:
data The drawed data in an object format
Type
Object
Example
{
	'point': [
		{lat: 45, lng: 12},
		{lat: 43, lng: 16}
	],
	'polyline': [
		[
			{lat: 45, lng: 12},
			{lat: 42, lng: 12},
			{lat: 42.6, lng: 11}
		],
		[
			{lat: 36.7, lng: 11.2},
			{lat: 39, lng: 12}
		],
	],
	'circle': [
		{lat: 45, lng: 12, radius: 10000},
		{lat: 44, lng: 11, radius: 230000}
	]
}

geocoderCenter

Sets the map center converting the geocoder_field input address in a LatLng point

Source:
  • gmapdraw.js, line 523
Returns:
void

geocoderDraw

Fires a map click in a LatLng point converted from the geocoder_field input address

Source:
  • gmapdraw.js, line 542
Returns:
void

getDrawingTool

Gets the active drawing tool

Source:
  • gmapdraw.js, line 466
Returns:
The drawing tool
Type
ajs.maps.gmapdraw.tool

getTool

Gets a tool object giving its name

Parameters:
Name Type Description
tool_name String One of the supported tools name
Source:
  • gmapdraw.js, line 230
Returns:
The tool object if set or null
Type
ajs.maps.gmapdraw.tool | null

gmap

Returns the google map instance google.maps.Map

The google map class instance allows to customize direclty some map properties using the google.maps.Map public interface
Source:
  • gmapdraw.js, line 668
Returns:
The google map instance
Type
google.maps.Map
Example
var mygmap = ajs.maps.gmapdraw.map.gmap();
mygmap.setCenter(new google.maps.LatLng(45, 7));

importMap

Imports data to the map

Data must be in the same form as the exported ones, see ajs.maps.gmapdraw.map#exportMap
Parameters:
Name Type Description
data Object The drawed data in an object format
Source:
  • gmapdraw.js, line 622

initControllers

Initializes all the map controllers

Source:
  • gmapdraw.js, line 304
Returns:
void

initMap

Initializes the google map and its events
Source:
  • gmapdraw.js, line 275
Returns:
void

initMapTips

Returns the init text shown in the tips controller

Source:
  • gmapdraw.js, line 497
Returns:
text The initial tip text
Type
String

initTools

Initializes the map set tools

Source:
  • gmapdraw.js, line 474
Returns:
void

mapClick

Handles the click event over the map, calling the active tool handler

This method is public since it has to be called by google maps api
Parameters:
Name Type Description
point Object The callback parameter returned by the google.maps event handler
Source:
  • gmapdraw.js, line 507
Returns:
void

<protected> processOptions

Processes the option object setting properly some class properties

Source:
  • gmapdraw.js, line 187
Returns:
void

<protected> removeClearMapController

Removes the clear map controller depending on the options.clear_map_ctrl value

Source:
  • gmapdraw.js, line 344
Returns:
void

<protected> removeExportMapController

Removes the export map controller depending on the options.clear_map_ctrl value

Source:
  • gmapdraw.js, line 380
Returns:
void

<protected> removeGeocoderMapField

Removes the geocoder input text field and its controllers

Source:
  • gmapdraw.js, line 442
Returns:
void

<protected> removeTipsMapController

Removes the tips map controller depending on the options.tips_map_ctrl value

Source:
  • gmapdraw.js, line 414
Returns:
void

removeTool

Removes a drawing tool

Parameters:
Name Type Description
tool_name String The name of the tool to be removed
tool ajs.maps.gmapdraw.tool The tool object
Source:
  • gmapdraw.js, line 248
Returns:
void

render

Renders the widget

Source:
  • gmapdraw.js, line 262
Returns:
void

setCenter

Sets the center of the map

Parameters:
Name Type Description
center Array The [lat, lng] coordinates array
Source:
  • gmapdraw.js, line 677
Returns:
void

<protected> setClearMapController

Sets the clear map controller depending on the options.clear_map_ctrl value

Source:
  • gmapdraw.js, line 319
Returns:
void

setClearMapCtrl

Sets the clear map controller

Parameters:
Name Type Description
ctrl String | Element The clear map controller. If 'default' the built-in controller is used, if null the clear map functionality is removed. If id attribute or an element the clear map functionality is attached to the element.
Source:
  • gmapdraw.js, line 703
Returns:
void

setDrawingTool

Sets the active drawing tool name

Parameters:
Name Type Description
tool ajs.maps.gmapdraw.tool | null The actual drawing tool, null to have no active tool
Source:
  • gmapdraw.js, line 455
Returns:
void

<protected> setExportMapController

Sets the export map controller depending on the options.export_map_ctrl value

Source:
  • gmapdraw.js, line 355
Returns:
void

setExportMapCtrl

Sets the export map controller

Parameters:
Name Type Description
ctrl String | Element The export map controller. If 'default' the built-in controller is used, if null the export map functionality is removed. If id attribute or an element the export map functionality is attached to the element.
Source:
  • gmapdraw.js, line 718
Returns:
void

setGeocoderMapField

Sets the geocoder map field option

Parameters:
Name Type Description
set Boolean Whether or not to activate the geocoder functionality
Source:
  • gmapdraw.js, line 731
Returns:
void

<protected> setGeocoderMapFieldController

Sets the geocoder input text field and its controllers

Source:
  • gmapdraw.js, line 424
Returns:
void

<protected> setTipsMapController

Sets the help tips map controller depending on the options.tips_map_ctrl value

Source:
  • gmapdraw.js, line 391
Returns:
void

setTipsMapCtrl

Sets the tips map controller

Parameters:
Name Type Description
ctrl String | Element The help tips map controller (shows tips about drawing tools). If 'default' the built-in controller is used, if null the tips box is not shown, if id attribute or an element the functionality is attached to the element.
Source:
  • gmapdraw.js, line 749
Returns:
void

setZoom

Sets the zoom of the map

Parameters:
Name Type Description
zoom Number The zoom level
Source:
  • gmapdraw.js, line 689
Returns:
void

updateTips

Updates the text displayed in the tips controller

Parameters:
Name Type Description
text String The tip text
Source:
  • gmapdraw.js, line 487
Returns:
void