Hi there,can you check if I did the implementation for basemapgallery in my example?
<!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" />
<!--The viewport meta tag is used to improve the presentation and behavior
of the samples on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
<title>
Basemap Gallery - Bing Maps
</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/esri/css/esri.css" />
<style type="text/css">
html,body {
height:100%;
width:100%;
margin:0;
padding:0;
}
body {
background-color:#feffff;
overflow:hidden;
font-family:"Trebuchet MS";
margin:2%;
}
#map {
-moz-border-radius:4px;
overflow:hidden;
border:solid 2px #03c;
}
.claro .dijitButtonText {
color:#03c;
font-family: Arial, Helvetica, sans-serif
font-weight:bold;
}
.claro td.dijitMenuItemLabel {
color:#03c;
font-family: Arial, Helvetica, sans-serif
font-weight:500;
}
</style>
<script type="text/javascript">
var djConfig = {
parseOnLoad: true
};
</script>
<script type='text/javascript' src='http://www.onemap.sg/API/JS/?accessKEY=onemapkey&v=2.8&type=full'></script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8">
</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("esri.dijit.BasemapGallery");
dojo.require("dijit.Tooltip");
dojo.require("dijit.form.Button");
dojo.require("dijit.Menu");
var basemaps = [];
var OneMap = new GetOneMap('map','SM');
var map, basemapGallery;
var bingKey = 'bingmapkey';
function init() {
//map = new esri.Map("map", {});
map = OneMap.map
createBasemapGallery();
dojo.connect(map, 'onLoad', function(map) {
//resize the map when the browser resizes
dojo.connect(dijit.byId('map'), 'resize', map,map.resize);
});
}
function createBasemapGallery(){
//Manually create a list of basemaps to display
var basemapRoad = new esri.dijit.Basemap({
layers: [new esri.dijit.BasemapLayer({
type: "BingMapsRoad"
})],
id: "bmRoad",
title: "Road"
});
basemaps.push(basemapRoad);
alert("lala2");
var basemapAerial = new esri.dijit.Basemap({
layers: [new esri.dijit.BasemapLayer({
type: "BingMapsAerial"
})],
id: "bmAerial",
title: "Aerial"
});
basemaps.push(basemapAerial);
alert("lala3");
var basemapHybrid = new esri.dijit.Basemap({
layers: [new esri.dijit.BasemapLayer({
type: "BingMapsHybrid"
})],
id: "bmHybrid",
title: "Aerial with labels"
});
basemaps.push(basemapHybrid);
alert("lala4");
basemapGallery = new esri.dijit.BasemapGallery({
showArcGISBasemaps: false,
basemaps: basemaps,
bingMapsKey: bingKey,
map: map
});
alert("lala5");
//BasemapGallery.startup isn't needed because we aren't using the default basemap, instead
//we are going to create a custom user interface to display the basemaps, in this case a menu.
dojo.forEach(basemapGallery.basemaps, function(basemap) {
//Add a menu item for each basemap, when the menu items are selected
dijit.byId("bingMenu").addChild(new dijit.MenuItem({
label: basemap.title,
onClick: dojo.hitch(this, function() {
this.basemapGallery.select(basemap.id);
})
}));
});
}
//show map on load
dojo.addOnLoad(init);
</script>
</head>
<body class="claro">
<div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false"
style="width: 95%; height: 94%;">
<div id="map" dojotype="dijit.layout.ContentPane" region="center">
<div style="position:absolute; right:50px; top:10px; z-Index:99;">
<button id="dropdownButton" label="Basemaps" dojoType="dijit.form.DropDownButton">
<div dojoType="dijit.Menu" id="bingMenu">
<!--The menu items are dynamically created using the basemap gallery layers-->
</div>
</button>
</div>
</div>
</div>
</body>
</html>
Ok the problem I'm facing now is when I choose one of the bingmaps from the dropdown list, the bingmap logo did appear but the map didn't so is it valid to use basemapgallery for two basemap with different spatial reference?sorry if I don't make sense,newbie here
