Hi All,
Urgent ...Pls help me.
Bing map is not loading in my application .It is showing blank screen.
Rest all maps working fine.Pls Help.Bing map key I used is correct
java script used below
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Map.aspx.vb" Inherits="Default2" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<!--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>Google Maps Layer in ArcGIS JS API</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/claro/claro.css"/>
<style type="text/css">
html, body, #mapDiv{
padding: 0;
margin: 0;
height: 100%;
z-index: -1;
}
.auto-style3 {
height: 20px;
}
.auto-style6 {
height: 2%;
width: 279px;
}
.auto-style7 {
width: 279px;
}
#TxtAltareeqEng {
width: 55px;
}
#TxtAltareeqEng0 {
width: 55px;
}
</style>
<script type="text/javascript">
var djConfig = {
parseOnLoad: true,
baseUrl: './',
modulePaths: {
// if use local copy, make sure the path reference is relative to 'baseUrl', e.g.:
//'agsjs': '../build/agsjs'
// use absolute path for online version. Note sometimes googlecode.com can be slow.
'agsjs': 'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/1.05/build/agsjs'
}
};
</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.4">
</script>
<script type="text/javascript" src="Scripts/gmapslayer_compiled.js">
</script>
<script src="Scripts/jquery-2.1.1.js" type="text/javascript"></script>
<script type="text/javascript">
window.onerror = function (msg, url, linenumber) {
alert('Error message: ' + msg + '\nURL: ' + url + '\nLine Number: ' + linenumber);
return true;
}
dojo.require("esri.map");
dojo.require("dijit.form.Button");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
//dojo.require("agsjs.layers.GoogleMapsLayer");
dojo.require("esri.layers.graphics");
dojo.require("esri.virtualearth.VETiledLayer");
var map;
var streetMap, esriTopo, gMap, BingLayer;
var graphicsLayer;
var Map1, Map2;
var lastposdate = "";
var DoorOpenClose = 'NO';
function init() {
var initExtent = new esri.geometry.Extent({
"xmin": -14628212,
"ymin": 714227,
"xmax": 7718305,
"ymax": 9832858,
"spatialReference": {
"wkid": 102100
}
});
//alert('init');
map = new esri.Map("mapDiv", {
extent: initExtent,
logo: true
});
Map1 = "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Population_World/MapSer...";
Map2 = "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServ...";
streetMap = new esri.layers.ArcGISDynamicMapServiceLayer(Map1, {
id: "streetMap"
});
map.addLayer(streetMap);
esriTopo = initLayer(Map2, "esriTopo");
BingLayer = new esri.virtualearth.VETiledLayer({
bingMapsKey: "A......",
id: 'BingLayer',
mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL
});
map.addLayer(BingLayer);
gMap = new gmaps.GoogleMapsLayer({
visible: false,
id: 'googlemaps'
});
map.addLayer(gMap);
graphicsLayer = new esri.layers.GraphicsLayer();
map.addLayer(graphicsLayer);
var resizeTimer;
dojo.connect(map, 'onLoad', function (theMap) {
dojo.connect(dijit.byId('map'), 'resize', function ()
{ //resize the map if the div is resized
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
map.resize();
map.reposition();
}, 500);
});
});
}
function initLayer(url, id) {
var layer = new esri.layers.ArcGISDynamicMapServiceLayer(url, {
id: id,
visible: false
});
map.addLayer(layer);
return layer;
}
function changeMap(layers) {
hideImageTiledLayers(layers);
for (var i = 0; i < layers.length; i++) {
layers.show();
alert(layers.id);
}
}
function hideImageTiledLayers(layers) {
for (var j = 0, jl = map.layerIds.length; j < jl; j++) {
var layer = map.getLayer(map.layerIds);
if (dojo.indexOf(layers, layer) == -1) {
layer.hide();
}
}
}
dojo.addOnLoad(init)
</script>
</head>
<body class="claro" >
<form id="form1" runat="server">
<div style="width: 100%; height: 100%">
<table id="Tablecontrols0" style="font-size: 15px; z-index: 101;
background-color: #5B748B; width: 100%; height: 100%;">
<tr style="font-family: Times New Roman">
<td style="border-style: none; background-color: #496277; "
valign="top" class="auto-style6" >
</td>
<td align="left" style="border-style: none; background-color: #496277; height: 2%;"
valign="top" class="auto-style3" >
</td>
</tr>
<tr style="font-family: Times New Roman">
<td style="border-style: none;"
valign="top" bgcolor="#496277" >
</td>
<td style="border-style: none; background-color: white; height: 500px;"
valign="top" id="td11" >
<div id="mapDiv" runat ="server" dojotype="dijit.layout.ContentPane" region="center"
style="border:1px solid #000; visibility: visible; height: 100%; ">
<br />
<br />
</div>
<div id="buttons" style="position:absolute; right:75px; top:83px; z-Index:999;">
<button dojoType="dijit.form.Button" onClick="changeMap([streetMap]);">
Al Tareeq(EN)</button>
<button dojoType="dijit.form.Button" onClick="changeMap([esriTopo]);">
Al Tareeq(AR)
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([gMap]);gMap.setMapTypeId('roadmap')">
Google Street
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([gMap]);gMap.setMapTypeId('satellite')">
Google Statellite
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([gMap]);gMap.setMapTypeId('hybrid')">
Google Hybrid
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([gMap]);gMap.setMapTypeId('terrain')">
Google Terrain
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([BingLayer]);BingLayer.setMapStyle('esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL');">
Bing Aerial
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([BingLayer]);BingLayer.setMapStyle('esri.virtualearth.VETiledLayer.MAP_STYLE_AERIAL');">
Bing Aerial with labels
</button>
<button dojoType="dijit.form.Button" onClick="changeMap([BingLayer]);">
Roads
</button>
</div> </td>
</tr>
</table>
</div>
</form>
</body>
</html>
