The location uses the standard Geographic latitude and longitude values.
In our example we would like to center the map to Dusseldorf, Germany.
Therefore we will apply the coordinates for Dusseldorf
The exact queried values are lat:51.2156299, lon:6.7760499
This takes place Where we edit the following section:
document.getElementById("map"),
{
'zoomLevel': 10, //zoom level for the map
'center': [52.51, 13.4] //center coordinates
}
In our case the Dusseldorf coordinates would look like this:
center : [51.21, 6.77]
You can experience to find the best initial zoom level for you, the values go up to 21. The bigger the value the more the map will be zoomed in (higher values for street level views).
In this example we would use zoomLevel 12 as follows:
zoomLevel : 5
The full edited code with all UI controls enabled would look like this:
var map = new ovi.mapsapi.map.Display(
document.getElementById("map"), {
components: [
//behavior collection
new ovi.mapsapi.map.component.Behavior(),
new ovi.mapsapi.map.component.ZoomBar(),
new ovi.mapsapi.map.component.Overview(),
new ovi.mapsapi.map.component.TypeSelector(),
new ovi.mapsapi.map.component.ScaleBar() ],
zoomLevel: 5,
center: [51.21, 6.77] //Dusseldorf, Germany
});
This code will give you the following map view when you have saved and published your post:
