- Parameters
- Options
- Example
- Methods
- fitToBoundingBox
- getBoundingBox
- getInitialBoundingBox
- getLayers
- getMouseMode
- off
- on
- once
- refresh
- reset
- setMouseMode
- usingLayer
- usingNewLayer
- Events
- Parameters
- Example
- Methods
- addFeature
- addFeatureCollection
- bringForwards
- bufferGeometry
- changeProperties
- clearFilters
- clearFeatures
- clearStyle
- clipByFeatureCollection
- convertToCentroids
- filterByBoundingBox
- filterByFeatureCollection
- filterByNearest
- filterByText
- getFeatureCollection
- hide
- sendBackwards
- show
- style
- update
- usingFeature
Methods
fitToBoundingBox
Sets the map view to contain a bounding box.
Parameters
Name | Required | Description |
---|---|---|
bbox | Yes | The bounding box that you want to contain in the view. If the bounding box has a different aspect ratio to the map, the map will make sure everything in the bounding box is visible. The format of the bbox parameter is an array of numbers and conforms to the GeoJSON standard for a bounding box i.e. [minX, minY, maxX, maxY] where: - minX (The minimum x-value of the bounding box) - minY (The minimum y-value of the bounding box) - maxX (The maximum x-value of the bounding box) - maxY (The maximum y-value of the bounding box) |
buffer | No | Expands (or contracts) the BoundingBox by this ratio. For example a value of 2 will make the bounding box twice as big and a value of 0.5 will make it half the size. |
Example
var map = new Mapzania.Map("map-div", "WORLD");
map.fitToBoundingBox([12.1,3.4,14.3,4.2], 1.25);
getBoundingBox
Get the current bounding box of the map as is visible on the screen. The format of the result is an array of numbers and conforms to the GeoJSON standard for a bounding box i.e. [minX, minY, maxX, maxY].
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD");
console.log(map.getBoundingBox());
//OUTPUT
[3.6, -10.5, 4.7, -8.6]
getInitialBoundingBox
Get the initial bounding box of the map. The format of the result is an array of numbers and conforms to the GeoJSON standard for a bounding box i.e. [minX, minY, maxX, maxY].
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD");
console.log(map.getInitialBoundingBox());
//OUTPUT
[3.6, -10.5, 4.7, -8.6]
getLayers
Returns a list of information about the layers associated with the map.
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD", function(){
var layers = map.getLayers();
console.log(layers);
});
//OUTPUT
[
{
key:"STREETS",
name:"Street Layer",
ordinal:0,
visible:true
},
{
key:"SUBURBS",
name:"Suburb Layer",
ordinal:1,
visible:false
}
]
getMouseMode
Returns the current MouseMode of the map.
The MapMode determines the behaviour of the map based on mouse activity. Examples of this behaviour include zooming, panning and drawing on the map.
The available values are held by the Mapzania.MouseModes object and are:
- Pan (default)
- DrawPoint
- DrawLine
- DrawPolygon
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD");
console.log(map.getMouseMode());
//OUTPUT
1
off
Removes all event listeners for an event on the Map object.
Parameters
Name | Required | Description |
---|---|---|
type | Yes | The type (name) of the event for which to clear all listeners. |
Example
var map = new Mapzania.Map("map-div", "WORLD");
map.on("roads_layer_queried", function (data) {
console.log(data);
map.off("roads_layer_queried");
});
on
Adds an event listener to the Map object. The listener will fire every time the event occurs.
Parameters
Name | Required | Description |
---|---|---|
type | Yes | The type (name) of the event for which to listen. |
fn | Yes | The function to run when the event is fired. This function will be passed an object containing the event results. The properties of this object will depend on the event that was fired. |
Example
var map = new Mapzania.Map("map-div", "WORLD", function(){
map.on("streets_layer_changed", function (data) {
console.log(data);
});
map.usingLayer("STREETS)
.filterByText("StreetType=='HIGHWAY'")
.update();
});
once
Adds an event listener to the Map object. The listener will fire once and then be disabled.
Parameters
Name | Required | Description |
---|---|---|
type | Yes | The type (name) of the event for which to listen. |
fn | Yes | The function to run when the event is fired. This function will be passed an object containing the event results. The properties of this object will depend on the event that was fired. |
Example
var map = new Mapzania.Map("map-div", "WORLD");
map.once("roads_layer_queried", function (data) {
console.log(data);
});
var filter = Mapzania.Filters.filterByText("StreetType=='HIGHWAY'");
map.query("STREETS", filter, {
ignoreAppliedFilters: true
});
refresh
Updates the map, by reloading all the visible layers using the current map bounds. This could be done, for example, if you changed some underlying data in your database.
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD");
// Code that changes underlying data
map.refresh();
reset
Zooms the map back to the starting bounds and sets the MapMode to Pan.
Parameters
No parameters.
Example
var map = new Mapzania.Map("map-div", "WORLD");
// Change the map mode and change the bounds of the map
map.reset();
setMouseMode
Sets the map mode which determines the behaviour of the map based on mouse activity. Examples of this behaviour include zooming, panning and drawing on the map.
When this method is called it fires the mouse_mode_set event.
Parameters
Name | Required | Description |
---|---|---|
mode | Yes | The mouse mode that you want the map to be in. Valid options are: -Mapzania.MouseModes.Pan (default) -Mapzania.MouseModes.DrawPoint -Mapzania.MouseModes.DrawLine -Mapzania.MouseModes.DrawPolygon NOTE: The last three modes fire the drawing_done event when completed. See manual for more details. |
Example
var map = new Mapzania.Map("map-div", "WORLD");
map.setMouseMode(Mapzania.MouseModes.DrawPoint);
usingLayer
Get a Layer Object from the map based on the key parameter.
This layer object is a fluent object and can be used to chain method calls to the layer as per the example below.
Parameters
Name | Required | Description |
---|---|---|
key | Yes | The key for the layer that will be used. |
Example
var map = new Mapzania.Map("map-div", "AFRICA", function () {
map.usingLayer("REGIONS")
.hide();
map.usingLayer("COUNTRIES")
.filterByText("LandLocked=='Y'")
.convertToCentroids()
.style({ fillColor: "#0000FF"})
.update();
});
usingNewLayer
Creates Layer Object with a key defined by the key parameter.
This layer object is a fluent object and can be used to chain method calls to the layer as per the example below.
NOTE: The layer created with usingNewLayer is a client-only layer. This means that it requires data to be added to it on the client. This is illustrated in the Feature Collection Filter Example.
Parameters
Name | Required | Description |
---|---|---|
key | Yes | The key for the new layer that will be created. |
Example
var map = new Mapzania.Map("map-div", "AFRICA", function () {
var geojson = {
type: "FeatureCollection",
features: [
//... some feature data ...
]
};
map.usingNewLayer("MY_LAYER")
.addFeatureCollection(geojson)
.filterByText("LandLocked=='Y'")
.convertToCentroids()
.style({ fillColor: "#0000FF"})
.update();
});