Turn Points Of Interest Invisible
This interactive map is rendered within the browser using SVG. The GIS raster map appears in the background.
Methods
Map Methods
| Name | Return | Description |
|---|---|---|
| .Map (id, map, options) | this | Creates and returns the map object. |
| .moveTo (id, zoom) | this | Moves the map to get the overlay at the center of the chart (if the zoom parameter is omitted, the map doesn't scale; if the zoom is 'auto', the map is scaled to best fit). |
| .moveTo ([φ, λ], zoom) | this | Moves the map to get these coordinates at the center of the chart (if the zoom parameter is omitted, the map doesn't scale; if the zoom is 'auto', the map is scaled to best fit). |
Overlay Methods
| Name | Return | Description |
|---|---|---|
| .overlayAppend (overlays) | this | Appends one or more overlays. |
| .overlayUpdate (overlays) | this | Updates one or more overlays. |
| .overlayRemove ([ids]) | this | Removes one or more overlays. |
| .overlayDelete () | this | Removes all the overlays. |
| .overlayBlink ([ids]) | this | Starts one or more overlays. |
| .overlayUnblink ([ids]) | this | Stops one or more overlays. |
| .overlaySetVisible ([ids]) | this | Sets one or more overlays, identified by their id, visible. |
| .overlaySetInvisible ([ids]) | this | Sets one or more overlays, identified by their id, invisible. |
| .overlayAttachTooltip (id, xmlString, width, height) | this | Attachs a user defined tooltip to a given overlay. The user defined HTML5 tooltip is included in a SVG foreignObject element. |
Event Methods
| Name | Return | Description |
|---|---|---|
| .addEventListener (type, listener) | this | Registers the specified listener on the EventTarget it's called on. |
| .addOneTimeEventListener (type, listener) | this | Registers the specified listener on the EventTarget it's called on for a one-time event. |
| .removeEventListener (type, listener) | this | Removes the event listener previously registered with addEventListener (). |
| .on (type, listener) | this | Alias on addEventListener (). |
| .one (type, listener) | this | Alias on addOneTimeEventListener (). |
| .off (type, listener) | this | Alias on removeEventListener (). |
Event Types
| Attribute | Type | Object | Info |
|---|---|---|---|
| 'overlayover' | String | OverEvent | Fired when the mouse enters on the overlay. |
| 'overlayout' | String | OverEvent | Fired when the mouse leaves the overlay. |
| 'click' | String | ClickEvent | Fired when the mouse clicks the overlay or the map. |
| 'dblclick' | String | ClickEvent | Fired when the mouse double clicks the overlay or the map. |
Event Objects
OverEvent
| Attribute | Type | Info |
|---|---|---|
| id | String | The id of the overlay that fired the event. |
| title | String | The title of this overlay. |
| style | Object | The style applied to this overlay. See the section 'Overlay Attributes' for the detail of the style attributes. |
| properties | Object/Array | The data displayed by the tooltip when the mouse goes over or leaves this overlay. |
| geometry | Object | The geometry of this overlay. See the section 'Overlay Attributes' for the detail of the geometry attributes. |
ClickEvent
| Attribute | Type | Info |
|---|---|---|
| overlay | Object | The OverEvent object of the (double) clicked overlay or null (user clicks the map). |
| cursor | Array | The coordinates of the point (double) clicked on the map ([latitude, longitude]). |
Map Attributes
map is an object with the following attributes:
| Attribute | Type | Default | Info |
|---|---|---|---|
| url | String | null | The url of the tile server. The url looks like 'http://{s}.title.server.org/{z}/{x}/{y}{retina}.png'. '{s}' means this tile server has several subdomains (optional), '{z}' is the zoom factor (mandatory), '{x}' is the tile number on the x-axis (mandatory), '{y}' is the tile number on the y-axis (mandatory), '{retina}' means the screen supports double size tiles (optional). |
| subdomains | Array | null | The available subdomains of the tile server. If the url contains '{s}', a list of subdomains must be provided. |
| retina | String | undefined | The pattern for requesting 'retina' tiles from the server. |
| coordinates | Array | [0, 0] | The coordinates of the center of the map (latitude and longitude in decimal units). |
| zoom | Number | 0 | The zoom factor. |
| maxZoom | Number | 19 | The maximum zoom level which will be displayed on the map. |
| minZoom | Number | 0 | The minimum zoom level which will be displayed on the map. |
| draggable | Boolean | true | Authorizes (true) or prevents (false) the map from being dragged. |
| scrollwheel | Boolean | true | Enables (true) or disables (false) scrollwheel zooming on the map. |
| keypad | Boolean | true | Enables (true) or disables (false) the keypad. |
If the map object is undefined, the following default map object is processed:
map = { url: '../maps/worldmap.json', origin: { x: 0, y: 50 }, scale: 1 };
Series Options
Not Applicable.
Chart Options
| Attribute | Type | Default | Info |
|---|---|---|---|
| chart | Object | The chart attributes. | |
| chart.type | String | map | The type of map (currently, 'map' is the only option). |
| chart.width | Number | 600 | The outer width of the chart. |
| chart.height | Number | 420 | The outer height of the chart. |
| tooltip | Object | The tooltip attributes. | |
| tooltip.enabled | Boolean | true | Enables (true) or disables (false) the tooltip. |
| tooltip.animated | Boolean | true | smoothly moves (true) or not (false) the tooltip from previous item to current. |
- means a computed value.
Overlay Attributes
The overlays are specified in an object. The overlays object has the following attributes:
| Attribute | Type | Default | Info | |
|---|---|---|---|---|
| 'id' | String or Number | The overlay Id. | ||
| 'id'.title | String | undefined | The name of the overlay. | |
| 'id'.style | Object | undefined | The style applied to the overlay. By default, the css style is applied. | |
| 'id'.style.fillColor | String | undefined | The color of the overlay. | |
| 'id'.style.fillOpacity | String | undefined | The opacity of the overlay. | |
| 'id'.style.strokeColor | String | undefined | The color of the overlay stroke. | |
| 'id'.style.strokeOpacity | String | undefined | The opacity of the overlay stroke. | |
| 'id'.style.strokeWidth | Number | undefined | The width of the overlay stroke. | |
| 'id'.style.backgroundColor | String | undefined | The color of the background. It applies to Icon overlay only. | |
| 'id'.style.backgroundOpacity | Number | undefined | The opacity of the background. It applies to Icon overlay only. | |
| 'id'.over | Object | undefined | The style to apply to the SVG elements that belong to the serie when the mouse is over the element. By default, the css style is applied. | |
| 'id'.over.fillColor | String | undefined | The fill color attribute. | |
| 'id'.over.fillOpacity | Number | undefined | The color opacity attribute. | |
| 'id'.over.stroke | String | undefined | The stroke color attribute. | |
| 'id'.over.strokeOpacity | Number | undefined | The stroke color opacity attribute. | |
| 'id'.over.strokeWidth | Number | undefined | The stroke width attribute. | |
| 'id'.over.backgroundColor | String | undefined | The color of the background. It applies to Icon overlay only. | |
| 'id'.over.backgroundOpacity | Number | undefined | The opacity of the background. It applies to Icon overlay only. | |
| 'id'.properties | Object/Array | null | A set of data displayed by the tooltip when the mouse goes over the overlay. | |
| 'id'.properties[n] | String | ' ' | If properties is an array of string, each string is a line of text displayed by the tooltip over the overlay. | |
| 'id'.properties[n] | String | ' ' | If properties is an object, each pair of key/value is a list of items displayed by the tooltip over the overlay. | |
| 'id'.visibilityRange | Object | undefined | defines a zoom range that turn the overlay visible. By default, all the zoom range. This visibility restriction applies to 'Icon' overlay only. | |
| 'id'.visibilityRange.minZoom | Number | undefined | minimum zoom value that turns the overlay visisble. | |
| 'id'.visibilityRange.maxZoom | Number | undefined | maximum zoom value that turns the overlay visisble. | |
| 'id'.geometry | Object | The geometry of the overlay. It looks like to the GeoJSON specification. See details below for each type of overlay. |
Point
The overlay Point has the following geometry attributes:
| Attribute | Type | Default | Info |
|---|---|---|---|
| 'id'.geometry | Object | The geometry of the overlay (similar to the GeoJSON specification). | |
| 'id'.geometry.type | String | 'Point' | The type of the overlay. Here a 'Point'. |
| 'id'.geometry.radius | Number | 0 | The radius of the 'Point' overlay (not in the GeoJSON specification). |
| 'id'.geometry.coordinates | Array | [ ] | The coordinates [φ, λ] of the center of the 'Point' overlay. |
Polyline
The overlay Polyline has the following geometry attributes:
| Attribute | Type | Default | Info |
|---|---|---|---|
| 'id'.geometry | Object | The geometry of the overlay (similar to the GeoJSON specification). | |
| 'id'.geometry.type | String | 'Polyline' | The type of the overlay. Here a 'Polyline'. |
| 'id'.geometry.coordinates | Array | [ ] | The coordinates [φ, λ] must be an array of LineString coordinate arrays. |
Polygon
The overlay Polygon has the following geometry attributes:
| Attribute | Type | Default | Info |
|---|---|---|---|
| 'id'.geometry | Object | The geometry of the overlay (similar to the GeoJSON specification). | |
| 'id'.geometry.type | String | 'Polygon' | The type of the overlay. Here a 'Polygon'. |
| 'id'.geometry.coordinates | Array | [ ] | The coordinates [φ, λ] must be an array of LinearRing coordinate arrays. |
Icon
The overlay Icon has the following geometry attributes:
| Attribute | Type | Default | Info |
|---|---|---|---|
| 'id'.geometry | Object | The geometry of the overlay (similar to the GeoJSON specification). | |
| 'id'.geometry.type | String | 'Icon' | The type of the overlay. Here a 'Icon' (that is not a GeoJSON object). |
| 'id'.geometry.shape | Object | Undefined | The 'Icon' overlay is a SVG object described thanks to a SVG path. |
| 'id'.geometry.shape.width | Number | Undefined | The width of the icon. |
| 'id'.geometry.shape.height | Number | Undefined | The height of the icon. |
| 'id'.geometry.shape.path | String | Undefined | The SVG path of the icon. |
| 'id'.geometry.coordinates | Array | [ ] | The coordinates [φ, λ] must be an array of LinearRing coordinate arrays. |