<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9" /> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title> </title> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css" /> <style type="text/css"> html, body { height: 100%; width: 100%; margin: 0; padding: 0; } .esriBasemapGallerySelectedNode .esriBasemapGalleryThumbnail{ border-color: #66FFFF !important; } #map{ padding:0; } </style> <script type="text/javascript"> var djConfig = { parseOnLoad: true }; </script> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script> <script type="text/javascript"> dojo.require("dijit.dijit"); // optimize: load dijit layer dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("esri.map"); dojo.require("dijit.TitlePane"); dojo.require("esri.dijit.BasemapGallery"); dojo.require("esri.arcgis.utils"); var map = null; function init() { var initExtent = new esri.geometry.Extent({ "xmin": -514440, "ymin": 5385504, "xmax": 4847158, "ymax": 7640702, "spatialReference": { "wkid": 102100} }); map = new esri.Map("map", { extent: initExtent }); createBasemapGallery(); //resize the map when the browser resizes dojo.connect(dijit.byId('map'), 'resize', map, map.resize); } function createBasemapGallery() { var basemapGallery = new esri.dijit.BasemapGallery({ showArcGISBasemaps: true, map: map }, "basemapGallery"); var selectionHandler = dojo.connect(basemapGallery, "onSelectionChange", callfunc); // { // dojo.disconnect(selectionHandler); // //add the esri population layer to the map // var operationalLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapServer", { "opacity": 0.5 }); // alert("firing"); // map.addLayer(operationalLayer); // }); basemapGallery.startup(); dojo.connect(basemapGallery, "onError", function (msg) { console.log(msg) }); } function callfunc() { alert("firing"); } //show map on load dojo.addOnLoad(init); </script> </head> <body class="claro"> <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width:100%;height:100%;margin:0;"> <div id="map" dojotype="dijit.layout.ContentPane" region="center" style="border:1px solid #000;"> <div style="position:absolute; right:20px; top:10px; z-Index:999;"> <div dojoType="dijit.TitlePane" title="Switch Basemap" closable="false" open="false"> <div dojoType="dijit.layout.ContentPane" style="width:380px; height:280px; overflow:auto;"> <div id="basemapGallery" ></div></div> </div> </div> </div> </div> </body> </html>
Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.