{"id":6178,"date":"2023-01-02T14:51:34","date_gmt":"2023-01-02T11:21:34","guid":{"rendered":"https:\/\/en.geobox.ir\/developers\/?post_type=docs&p=6178"},"modified":"2023-01-19T14:36:01","modified_gmt":"2023-01-19T11:06:01","slug":"working-with-map","status":"publish","type":"docs","link":"https:\/\/en.geobox.ir\/developers\/docs\/map-geobox-api-for-javascript\/working-with-map\/","title":{"rendered":"Map object"},"content":{"rendered":"

Tip: After you access the map<\/a> object, the following methods and properties are applicable on the map.<\/p>\n

Properties:<\/h2>\n

uuid<\/h3>\n

Returns the universally unique identifier\u00a0(UUID)<\/a> of the map.<\/p>\n

Returns:<\/strong><\/p>\n

uuid<\/a>: Returns uuid string.<\/p>\n

Example:<\/strong><\/p>\n

const mapUuid = map.uuid;<\/pre>\n
name<\/h3>\n
Returns the name of the map.<\/p>\n
Returns:<\/strong><\/p>\n
String: Returns map name.<\/p>\n
Example:<\/strong><\/p>\n
const mapName = map.name;<\/pre>\n
display_name<\/h3>\n
Returns the display name of the map.<\/p>\n
Returns:<\/strong><\/p>\n
String: Returns map display name.<\/p>\n
Example:<\/strong><\/p>\n
const mapDisplayName = map.display_name;<\/pre>\n
description<\/h3>\n
Returns the description of the map.<\/p>\n
Returns:<\/strong><\/p>\n
String: Returns map description.<\/p>\n
Example:<\/strong><\/p>\n
const mapDescription = map.description;<\/pre>\n
created_at<\/h3>\n
Returns the time and date that the map was created.<\/p>\n
Returns:<\/strong><\/p>\n
Date: Returns map created time.<\/p>\n
Example:<\/strong><\/p>\n
const mapCreatedTime = map.created_at;<\/pre>\n
last_modified_at<\/h3>\n
Returns the time and date that the map is updates.<\/p>\n
Returns:<\/strong><\/p>\n
Date: Returns map updated time.<\/p>\n
Example:<\/strong><\/p>\n
const mapModifiedTime = map.last_modified_at;<\/pre>\n
is_shared<\/h3>\n
Indicates whether the map is shared or not.<\/p>\n
Returns:<\/strong><\/p>\n
Bolean: If true, map is shared.<\/p>\n
Example:<\/strong><\/p>\n
const isShared = map.is_shared;<\/pre>\n
id<\/h3>\n
Returns the map id.<\/p>\n
Returns:<\/strong><\/p>\n
Number: Returns map id.<\/p>\n
Example:<\/strong><\/p>\n
const mapId = map.id;<\/pre>\n
owner_id<\/h3>\n
Returns the user ID that the map belongs to.<\/p>\n
Returns:<\/strong><\/p>\n
Number: Returns map owner id.<\/p>\n
Example:<\/strong><\/p>\n
const mapOwnerId = map.owner_id;<\/pre>\n
extent<\/h3>\n
Returns the coordinates of the map extent in the geographic coordinate system.<\/p>\n
Returns:<\/strong><\/p>\n
Array: Returns an array includes [southwest lng, southwest lat,\u00a0 northeast lng, northeast lat].<\/p>\n
Example:<\/strong><\/p>\n
const mapExtent = map.extent;<\/pre>\n
settings<\/h3>\n
Returns the map settings. These settings include editable layers, layer color settings, etc.<\/p>\n
Returns:<\/strong><\/p>\n
Object: Returns settings object.<\/p>\n
Example:<\/strong><\/p>\n
const mapSettings = map.settings;<\/pre>\n
Methods:<\/h2>\n
getStyle()<\/h3>\n
Returns the map style. This function is an asynchronous function.<\/p>\n
Returns:<\/strong><\/p>\n
Style<\/a>: Returns style object.<\/p>\n
Example:<\/strong><\/p>\n
const mapStyle = await map.getStyle();<\/pre>\n
getThumbnailURL()<\/h3>\n
Returns the URL of the map thumbnail.<\/p>\n
Returns:<\/strong><\/p>\n
String: Returns thumbnail PNG URL.<\/p>\n
Example:<\/strong><\/p>\n
const mapThumbnailUrl = map.getThumbnailURL();<\/pre>\n
updateSettings(options)<\/h3>\n
Updates the map settings.<\/p>\n
Parameters:<\/strong><\/p>\n
options (Object)<\/p>\n\n\n\n\n\n\n\n\n\n\n
Name<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
\n
options.general_settings<\/div>\n
Object?<\/div>\n<\/td>\n
An object that includes general settings. Keys and values are:<\/p>\n
‘map_unit’: ‘latlng’ | ‘utm’<\/p>\n
‘base_map’: ‘OSM’ | ‘google’ | ‘blank’;<\/p>\n
‘flash_color’: ‘rgb(255,0,0)’ (rgb color or rgba color or hex color )<\/p>\n
‘highlight_color’: ‘rgb(255,0,0)’ (rgb color or rgba color or hex color )<\/p>\n
‘selection_color’: ‘rgb(255,0,0)’ (rgb color or rgba color or hex color )<\/p>\n
‘selectable_layers’: ‘ALL’ | null | Comma separated list of layers<\/p>\n
‘show_maptip_on’: ‘ALL’ | null | Comma separated list of layers<\/td>\n<\/tr>\n
\n
options.<\/span>edit_settings<\/span><\/div>\n
\n
Object?<\/div>\n<\/div>\n<\/td>\n
An object that includes edit settings. Keys and values are:<\/p>\n
‘target_layer’: name of a vector layer or vector layer view.<\/p>\n
‘editable_layers’: ‘ALL’ | null | Comma separated list of layers<\/td>\n<\/tr>\n
\n
options.<\/span>snap_settings<\/span><\/div>\n
\n
\n
Object?<\/div>\n<\/div>\n<\/div>\n<\/td>\n
An object that includes snap settings. Keys and values are:<\/p>\n
snap_tolerance’: number of pixels for snap tolerance<\/p>\n
‘snap_unit’: ‘pixels’<\/p>\n
‘snap_mode’: ‘both’ | ‘edge’ | ‘vertex’<\/p>\n
‘snap_cache’: number of total features for snap cache<\/p>\n
‘snappable_layers’: ‘ALL’ | null | Comma separated list of layers<\/td>\n<\/tr>\n
\n
options.search_settings<\/div>\n
Object?<\/div>\n<\/td>\n
An object that includes snap settings. Keys and values are:<\/p>\n
‘search_mode’: ‘both’ | ‘markers’ | ‘layers’<\/p>\n
‘search_layers’: ‘ALL’ | null | Comma separated list of layers<\/td>\n<\/tr>\n
\n
options.marker_settings<\/div>\n
Object?<\/div>\n<\/td>\n
An object that includes marker settings. Keys and values are:<\/p>\n
‘remvoe_unused_tags’: true | false<\/td>\n<\/tr>\n
\n
options.controls<\/div>\n
Array?<\/div>\n<\/td>\n
Comma separated list of controls that should be enabled in map.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Returns:<\/strong><\/p>\n
Object: Returns settings object.<\/p>\n
Example:<\/strong><\/p>\n
const mapSettings = await map.updateSettings({\r\n   'general_settings': {\r\n      'map_unit': 'latlng',\r\n      'base_map': 'OSM',\r\n      'flash_color': 'rgb(255,0,0)',\r\n      'highlight_color': '#fbb440',\r\n      'selection_color': '#004cff',\r\n      'selectable_layers': 'ALL',\r\n      'show_maptip_on': null\r\n   },\r\n   'edit_settings': {\r\n      'target_layer': 'vector\/selected-roads',\r\n      'editable_layers': 'ALL'\r\n   },\r\n   'snap_settings': {\r\n      'snap_tolerance': 5,\r\n      'snap_unit': 'pixels',\r\n      'snap_mode': 'both',\r\n      'snap_cache': 500,\r\n      'snappable_layers': 'ALL'\r\n   },\r\n   'search_settings': {\r\n      'search_mode': 'both',\r\n      'search_layers': 'ALL'\r\n   },\r\n   'marker_settings': {\r\n      'remvoe_unused_tags': true\r\n   },\r\n   'controls': [\r\n      'overview',\r\n      'scalebar',\r\n      'searchbar',\r\n      'legend',\r\n      'basemaps',\r\n      'coordinates',\r\n      'measurement',\r\n      'print',\r\n      'gotoxy',\r\n      'location',\r\n      'edit'\r\n   ]\r\n});<\/pre>\n
getMarkers()<\/h3>\n
Returns the markers and tags that is stored in the map. This function is an asynchronous function.<\/p>\n
Returns:<\/strong><\/p>\n
Object: Returns Markers object. This object contains a list of markers location\u00a0and tags object.<\/p>\n
Example:<\/strong><\/p>\n
const mapMarkers = await map.getMarkers();<\/pre>\n
setMarkers(options)<\/h3>\n
Saves the map markers and tags.<\/p>\n
Parameters:<\/strong><\/p>\n
options (Object)<\/p>\n\n\n\n\n\n\n
Name<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
\n
options.tags<\/div>\n
Object?<\/div>\n<\/td>\n
An object that includes tags and colors.<\/td>\n<\/tr>\n
\n
options.locations<\/span><\/div>\n
\n
Array?<\/div>\n<\/div>\n<\/td>\n
An array that includes markers objects<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Returns:<\/strong><\/p>\n
Object: Returns Markers object. This object contains a list of markers location\u00a0and tags object.<\/p>\n
Example:<\/strong><\/p>\n
const\u00a0mapMarkers = await map.setMarkers({\r\n   'tags': {\r\n      '#general': {\r\n         'color': '#ff0000',\r\n      }\r\n   },\r\n   'locations': [\r\n      {\r\n         'tag': '#general',\r\n         'name': 'test',\r\n         'geometry': [\r\n            51.13162784422988,\r\n            35.766603814763045\r\n          ],\r\n      'description': 'string'\r\n      }\r\n   ]\r\n});<\/pre>\n","protected":false},"excerpt":{"rendered":"
Tip: After you access the map object, the following methods and properties are applicable on the map. Properties: uuid Returns the universally unique identifier\u00a0(UUID) of the map. Returns: uuid: Returns uuid string. Example: const mapUuid = map.uuid; name Returns the name of the map. Returns: String: Returns map name. Example: const mapName = map.name; display_name […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[65],"doc_tag":[],"class_list":["post-6178","docs","type-docs","status-publish","hentry","doc_category-map-geobox-api-for-javascript"],"_links":{"self":[{"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/docs\/6178","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/comments?post=6178"}],"version-history":[{"count":24,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/docs\/6178\/revisions"}],"predecessor-version":[{"id":6586,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/docs\/6178\/revisions\/6586"}],"wp:attachment":[{"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/media?parent=6178"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/doc_category?post=6178"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/en.geobox.ir\/developers\/wp-json\/wp\/v2\/doc_tag?post=6178"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}