var map = Gp.Map.load( "map", // html div { // Geoportal access key obtained here : https://geoservices.ign.fr/services-web apiKey: "ortho,topographie", // load the map with itowns (in 3D) viewMode : "3d", //path to the iTowns library enginePath3d: "https://ignf.github.io/geoportal-sdk/latest/dist/3d/", // layers to display zoom : 12, projection : "EPSG:4326", center : { x : -2.5, y : 48 }, layersOptions : { "PCRS" : {}, "BUILDINGS.BUILDINGS" : { queryable : true } }, // additional tools to display on the map controlsOptions : { "layerSwitcher" : {}, "getfeatureinfo" : { // activate GFI on BU.Building layer layers : { "BUILDINGS.BUILDINGS" : {} } } } } ) ; var infoDiv = document.getElementById("info"); infoDiv.innerHTML = "<p> SDK version " + Gp.sdkVersion + " (" + Gp.sdkDate + ")</p>";
html { height: 100%; } body { margin: 0; overflow:hidden; height:100%; } #map { margin : auto auto; width: 100%; height: 300px; padding: 0; } #tiltButton { background-color: white; position: absolute; top: 20px; left : 50px; } #info { padding: 5px; width: 100%; height: 20px; font-family: "monospace"; font-size: 10px; }
<div id="map"> <button id="tiltButton"> jsFiddle bug - click on this text to activate tilt (ctrl + left click) <br> Do not integrate this button to your own non-jsFiddle pages </button> </div> <div id="info"></div>