A simple Map (Map-API)

Description

All you need to integrate one of the several outdooractive maps or thematic layers is to integrate a map on your page.

First add a div container with a dom id (set to “map_canvas” in this example) to your page:

<div id="map_canvas" style="width: 100%; height: 600px;"></div>

Then initialize the Outdooractive Map API by calling the method oax.api.maps() during page load:

var map;

// call the outdooractive maps api initialization method with a callback function
oa.api.maps(
    function (oamaps, gm) {

	// set map center, zoom level, map types and more
	var config = {
            center : { lat: 47.54687, lng: 10.2928 },
            zoom : 10,

            mapInit : {
                basemap: "osm",
                style:   "winter",
                overlay: "slope"
            }

        };

	// instatiate a new outdooractive map
	// params: dom id of map canvas div, configuration object
	map = oamaps.map( "map_canvas", config );
});

The Outdooractive Maps API may be loaded asynchronously after page load or on user interaction. The Asynchronous Loading Example shows how this is done.