js百度地图API只在IE显示其余的浏览器都不显示。

KK攻城狮 2016-09-12 11:03:04

代码附上求解

<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>当前地点</title>
<style type="text/css">
html {
height: 100%;
}

body {
height: 50%;
margin: 0px;
padding: 0px;
}

#container {
width: 100%;
height: 500px;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.1&services=true"></script>
<script src="Scripts/jquery-1.10.2.js"></script>
</head>
<body onload="enter()">
<div id="container">
</div>
<input id="lons" type="hidden" />
<input id="lats" type="hidden" />

<script type="text/javascript">
var province = 0;
var city = 0;
var district = 0;
var street = 0;
var lat;
var lon;

function enter() {
if (navigator.geolocation) { //调用导航器geolocation函数
navigator.geolocation.getCurrentPosition(loand); //进入总显示函数loand，函数名由自己定
} else {
alert("您的浏览器不支持地理定位"); //不支持
}
}
function loand(position) { //主函数
lat = position.coords.latitude; //y，纬度，通过上面的getCurrentPosition函数定位浏览器位置，从而获取地址
lon = position.coords.longitude; //x，经度
//alert(lat);
ajaxs(); //执行Ajax方法

var map = new BMap.Map("container"); //初始化地图类
var point = new BMap.Point(lon, lat); //这里设置刚开始的点所在处
var gc = new BMap.Geocoder(); //初始化，Geocoder类
gc.getLocation(point,
function (rs) { //getLocation函数用来解析地址信息，分别返回省市区街等
var addComp = rs.addressComponents;
province = addComp.province; //获取省份
city = addComp.city; //获取城市
district = addComp.district; //区
street = addComp.street; //街

var marker = new BMap.Marker(point); //地图事件类
var opts = {
width: 25,
// 信息窗口宽度
height: 120,
// 信息窗口高度
title: "我所在的地点:<hr />" // 信息窗口标题，这里声明下，可以在自己输出的信息里面嵌入html标签的
}
var infoWindow = new BMap.InfoWindow("省份: " + province + ";" + "城市:" + city + ";<br /><br />" + "县/区:" + district + ";" + "街道:" + street + ".", opts);
// 创建信息窗口对象，把信息在初始化地图信息窗口类的同时写进去
marker.addEventListener("mouseover",
function () {
this.openInfoWindow(infoWindow, point);
});
marker.addEventListener("mouseout",
function () {
map.closeInfoWindow(infoWindow, point);

});

marker.enableDragging(); //启用拖拽事件
marker.addEventListener("dragend",
function (e) {
gc.getLocation(point,
function (rs) {
//由于在getLocation函数返回信息之前，首先执行它下面的代码的，所以要把重新拖动后的代码放到它里面
var addComp = rs.addressComponents;
province = addComp.province; //获取省份
city = addComp.city; //获取城市
district = addComp.district; //区
street = addComp.street; //街
opts = {
width: 25,
// 信息窗口宽度
height: 160,
// 信息窗口高度
title: "现在的位置:<hr />" // 信息窗口标题
}
point = new BMap.Point(e.point.lng, e.point.lat); //标记新坐标（拖拽以后的坐标）
marker = new BMap.Marker(point); //事件类

infoWindow = new BMap.InfoWindow("<a href='#'>省份2:</a>" + province + ";" + "城市:" + city + ";<br /><br />" + "县/区:" + district + ";" + "街道:" + street + ".<br />" + "经度：" + e.point.lng + "<br />纬度：" + e.point.lat, opts + "</div>");

map.openInfoWindow(infoWindow, point);
//这条函数openInfoWindow是输出信息函数，传入信息类和点坐标
})
})
//地图控件添加函数：
var top_left_control = new BMap.ScaleControl({
anchor: BMAP_ANCHOR_BOTTOM_RIGHT
}); // 左上角，添加比例尺
map.enableScrollWheelZoom(); //滚动放大
map.enableKeyboard(); //键盘放大
map.centerAndZoom(point, 15); //绘制地图
map.addOverlay(marker); //标记地图
map.addControl(top_left_control);
map.openInfoWindow(infoWindow, map.getCenter()); // 打开信息窗口
});

var myP1 = BMap.Point(lon, lat); //起点
var myP2 = new BMap.Point(121.434300, 31.221900); //终点
var myIcon = new BMap.Icon("http://developer.baidu.com/map/jsdemo/img/Mario.png", new BMap.Size(32, 70), { //小车图片
//offset: new BMap.Size(0, -5), //相当于CSS精灵
imageOffset: new BMap.Size(0, 0) //图片的偏移量。为了是图片底部中心对准坐标点。
});
var driving2 = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true } }); //驾车实例
driving2.search(myP1, myP2); //显示一条公交线路

window.run = function () {
var driving = new BMap.DrivingRoute(map); //驾车实例
driving.search(myP1, myP2);
driving.setSearchCompleteCallback(function () {
var pts = driving.getResults().getPlan(0).getRoute(0).getPath(); //通过驾车实例，获得一系列点的数组
var paths = pts.length; //获得有几个点

var carMk = new BMap.Marker(pts[0], { icon: myIcon });
map.addOverlay(carMk);
i = 0;
function resetMkPoint(i) {
carMk.setPosition(pts[i]);
if (i < paths) {
setTimeout(function () {
i++;
resetMkPoint(i);
}, 100);
}
}
setTimeout(function () {
resetMkPoint(5);
}, 100)

});
}

setTimeout(function () {
run();
}, 1500);
}
function ajaxs() {
$.ajax({
type: 'post',
url: 'Handler1.ashx/ProcessRequest',
data: {
lat: lat,
lon: lon
},

async: true,//true为异步请求，false为同步请求
//contentType: 'text/javascript',
dataType: 'json',
success: function (data) {

alert("成功");
},
rror: function (xhr) {
alert("出现错误，请稍后再试:" + xhr.responseText);
}
})
} </script>
</body>
</html>

...全文