直接附代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=自己的AK"></script>
<title>GPS坐标百度转换</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
var points = [
new BMap.Point(116.697068,39.709336),
new BMap.Point(116.697113,39.709204),
new BMap.Point(116.697068,39.709069),
new BMap.Point(116.697091,39.708934),
new BMap.Point(116.697064,39.708795),
new BMap.Point(116.697113,39.708538),
new BMap.Point(116.697091,39.708531),
new BMap.Point(116.697077,39.708399),
new BMap.Point(116.697109,39.708264),
new BMap.Point(116.697095,39.708136),
new BMap.Point(116.697095,39.708136),
new BMap.Point(116.697104,39.707865),
new BMap.Point(116.697113,39.707747),
new BMap.Point(116.697464,39.709718),
new BMap.Point(116.697432,39.709572),
new BMap.Point(116.697482,39.709447),
new BMap.Point(116.697468,39.709315),
new BMap.Point(116.697477,39.709180),
new BMap.Point(116.697473,39.709048),
new BMap.Point(116.697464,39.708902),
new BMap.Point(116.697455,39.708791),
new BMap.Point(116.697414,39.708653),
new BMap.Point(116.697441,39.708524),
new BMap.Point(116.697450,39.708379),
new BMap.Point(116.697441,39.708396),
new BMap.Point(116.697401,39.708132),
new BMap.Point(116.697450,39.707987),
new BMap.Point(116.697437,39.707830),
new BMap.Point(116.697428,39.707730),
new BMap.Point(116.697926,39.709749),
new BMap.Point(116.697931,39.709614),
new BMap.Point(116.697931,39.709614),
new BMap.Point(116.697953,39.709340),
new BMap.Point(116.697971,39.709208),
new BMap.Point(116.697967,39.709076),
new BMap.Point(116.697971,39.708937),
new BMap.Point(116.697976,39.708823),
new BMap.Point(116.697998,39.708673),
new BMap.Point(116.697998,39.708545),
new BMap.Point(116.697971,39.708420),
new BMap.Point(116.697980,39.708275),
new BMap.Point(116.697998,39.708157),
new BMap.Point(116.697989,39.708007),
new BMap.Point(116.697967,39.707879),
new BMap.Point(116.697985,39.707758),
new BMap.Point(116.698438,39.709718),
new BMap.Point(116.698461,39.709586),
new BMap.Point(116.698456,39.709461),
new BMap.Point(116.698443,39.709322),
new BMap.Point(116.698465,39.709183),
new BMap.Point(116.698506,39.709180),
new BMap.Point(116.698488,39.708920) ];
var newPoints=[];
var bm = new BMap.Map("allmap");
bm.centerAndZoom(new BMap.Point(116.697068,39.709336), 15);
var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角,添加比例尺
var top_left_navigation = new BMap.NavigationControl(); //左上角,添加默认缩放平移控件
bm.addControl(top_left_control);
bm.addControl(top_left_navigation);
//坐标转换的回调函数
translateCallback = function (data){
if(data.status === 0) {
for (var i = 0; i < data.points.length; i++) {
newPoints=newPoints.concat(data.points[i]);//将转换后的新坐标,添加到新的数组中。
}
ssi++;//标识符自增
if(ssi<tenLength){//因为每次只能转10个点,判断数组中是否还存在多余的点,取代for循环,在回调中执行转换函数,保证前一次的坐标都添加到新数组中。
zhuanhuan();
}
if(newPoints.length===points.length){//当转后和转前的坐标数组长度一致时,证明已经转完,进行画点操作
huaPoint();
}
}
}
function huaPoint(){
for (var i = 0; i < newPoints.length; i++) {
if(i==0){
bm.addOverlay(new BMap.Marker(newPoints[i]));
}else if(i== newPoints.length-1){
bm.addOverlay(new BMap.Marker(newPoints[i]));
}else{
bm.addOverlay(new BMap.Marker(newPoints[i]));
}
bm.setCenter(newPoints[i]);
}
}
var pointsLength=points.length;//转换前点集的长度
var tenLength=parseInt(pointsLength/10);//判断长度是10的几倍
var tenMod=pointsLength%10;//对10取余数,如果大于零证明存在不是10的整数倍
if (tenMod>0){
tenLength=tenLength+1;
}
var ssi=0;//标识符,与tenLength进行比较判断是否调用zhuanhuan()方法
//转坐标的函数
function zhuanhuan(){
if(pointsLength==0){//如果数组的长度是0,直接返回,即转换数组是空的。
return;
}
var convertor = new BMap.Convertor();
var start=parseInt(10*ssi);
var end=parseInt(start+10);
if(end>=pointsLength){//如果结束标识长度,大于整个数组长度时,将结束的长度赋值为数组的长度+1,保证每个值都能被去到。
end=parseInt(pointsLength+1);
}
var arrys=points.slice(start, end);//取出原数组中即将被转化的点
convertor.translate(arrys, 1, 5, translateCallback);//调用转换函数,并且调用translateCallback回调函数
}
setTimeout(zhuanhuan(), 1000);
</script>
实现效果图:
附主要参考链接:https://download.csdn.net/download/qq_35392674/10422804