Map Layers

The MapLayer class lets you specify a Tile Map Service (TMS) that will provide the map images rendered by the library. Use the urlTemplate property to set your chosen TMS:

JavaScript

var m = MindFusion.Mapping;// create a new instance of the mapView 
view = new m.MapView(document.getElementById("mapView"));var l = new m.MapLayer("Streets");
l.urlTemplate = "http://d.tile.stamen.com/terrain/{z}/{x}/{y}.png";

The layers property holds all layers for the MapView - DecorationLayer-s and MapLayer-s. Add the new MapLayer to it:

JavaScript

view.layers.add(l);

If you are using a free TMS and need to provide attribution to its owner - use the attribution property to do it:

JavaScript

l.attribution = 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a  href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. Data by <a  href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://www.openstreetmap.org/copyright">ODbL</a>.';

The attribution property supports HTML formatting symbols.

You can add unlimited number of MapLayer-s to a MapView. When the number is more than one the layer controller automatically appears in the right top corner of the map. It provides radio buttons for switching among the layers:

A map with several MapLayer instances.

The label rendered for a given MapLayer by the layer controller is its name as set in the constructor. You can hide the layer controller:

JavaScript

view.showLayerController = false;

The layers property of the MapView holds all layers - both decoration and map. If you want to acces the list only with MapLayer-s you can use the readonly mapLayers property.

You can specify the zoom ratio with which the MapView is loaded initially through the load method. Its first parameter points to the location, which will be loaded at the center of the map. The second parameter is the zoom coefficient:

JavaScript

view.load(new m.LatLong(52.523430, 13.411440), 15);

The location is a LatLong instance.

Note
Remember always to call the load method after you've finished customizing the map.