A Single Tour (Map-API)

Description

This examples shows how easy a single tour may be shown on a map using the GeomLayer. The tour geometry and all related POIs (Relations manually set by the author of the tour) are loaded and rendered with some lines of code. The GeomLayer ensures that the map is zoomed and panned to fit the bounding box surrounding the tour geometry and all POIs.

oa.api.maps( initOA );
var l;
function initOA( oamaps, gm ) {

    // a single tour
    var content = '1536393';

    var layerConfig = (oa.PREFIX === 'oam') ? null : {
	markersActive : true,
	fitPoiBounds : true,
	defaultIW : true
    };

    // initialize GeomLayer
    layer = new oamaps.GeomLayer( content, layerConfig );

    layer.whenLoaded( initMap );

    function initMap() {

	var mapId = "map_canvas";
	var mapDiv = document.getElementById( mapId );

	var mapTypeIds = ['oa_map', 'oa_topo', 'oa_map_winter' ];

	var mapConfig = {
            zoom: 16,
            mapTypeId : mapTypeIds[ 0 ],
            mapTypeControlOptions : { mapTypeIds: mapTypeIds },
	    oa: { maplibre: false }
        };

        var bounds = layer.getBounds();

        if (oa.PREFIX=='oax') {
            mapConfig.bounds = bounds;
	    map = oamaps.map( mapDiv, mapConfig );
        } else {
            mapConfig.center = bounds.center;
	    map = oamaps.map( mapDiv, mapConfig );
            map.fitBounds(L.latLngBounds([bounds.south, bounds.west], [bounds.north, bounds.east]));
        }

        // add GeomLayer to map
        layer.setMap( map );
        
    }

}