使用百度地图开发,画线时内存溢出
保存2000个点,然后每次新加点就shift掉头一个,发现浏览器内存一直在涨,能有大神帮忙看下吗,我用定时器将经纬度定时增加了,100ms发一次。399行到408行
<html>
<head>
<title>百度地图(QQ: 517216493)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<style type="text/css">
html,
body {
font-family: 微软雅黑;
height: 100%;
width: 100%;
margin: 0px;
padding: 0px;
}
.anchorBL {
opacity: 0;
}
#map {
height: 100%;
width: 100%;
}
::-webkit-scrollbar {
width: 0.8em;
}
::-webkit-scrollbar-track {
background: rgb(241, 241, 241);
}
::-webkit-scrollbar-thumb {
background: rgb(188, 188, 188);
}
#info {
min-width: 200px;
/* height: 50px; */
/* border: 1px solid #e4393c; */
/* padding: 10px; */
z-index: 999;
position: absolute;
top: 10;
right: 10;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
background: #FFFFFF;
opacity: 0.8;
border-radius: 8px;
}
.infoUL {
font-size: 10pt;
padding-left: 0;
/* text-align: center; */
list-style-type: none;
}
.infoLI {
margin: 10px;
margin-bottom: 10px;
cursor: pointer;
color: #e4393c;
}
.infoLI.hover {
color: #1a1a1a;
}
.title {
/* padding-right: 10px; */
width: 120px;
display: inline-block;
/* 对超出内容隐藏 */
overflow: hidden;
/* 显示省略符号来代表被修剪的文本 */
text-overflow: ellipsis;
}
.detail {
width: 80px;
display: inline-block;
font-weight: bold;
text-align: right;
float: right;
/* 对超出内容隐藏 */
overflow: hidden;
/* 显示省略符号来代表被修剪的文本 */
text-overflow: ellipsis;
}
[v-cloak] {
display: none;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=9GqzBZjfGqXYXMzdfuRN9AL4B4PHaY6R"></script>
<!-- <script type="text/javascript" src="http://api.map.baidu.com/library/CurveLine/1.5/src/CurveLine.min.js"></script> -->
<!-- <script type="text/javascript"
src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script> -->
<!-- <script type="text/javascript"
src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script> -->
<!-- <script type="text/javascript"
src="http://api.map.baidu.com/library/TrackAnimation/src/TrackAnimation_min.js"></script> -->
<!-- <script type="text/javascript"
src="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.js"></script> -->
<!-- <link rel="stylesheet" type="text/css"
href="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.css" /> -->
<!-- <script type="text/javascript"
src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script> -->
<!-- <link rel="stylesheet" type="text/css"
href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" /> -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<!-- <script src="gps.js"></script> -->
</head>
<body>
<div id='map' v-cloak></div>
<div id="info" v-show="tableShow" v-cloak>
<ul class="infoUL">
<li class="infoLI" v-for="(item,idx) in signalListTitle" v-on:click="receiveDataClick('row',idx)"
:class="idx==index?'hover':''" :key="idx">
<span :title=item class="title">{{item}}:</span><span :title=signalListdetail[idx]
class="detail">{{signalListdetail[idx]}}</span>
</li>
</ul>
</div>
</body>
<script type="text/javascript">
var GPS = {
PI: 3.14159265358979324,
x_pi: 3.14159265358979324 * 3000.0 / 180.0,
delta: function (lat, lon) {
// Krasovsky 1940
//
// a = 6378245.0, 1/f = 298.3
// b = a * (1 - f)
// ee = (a^2 - b^2) / a^2;
var a = 6378245.0; // a: 卫星椭球坐标投影到平面地图坐标系的投影因子。
var ee = 0.00669342162296594323; // ee: 椭球的偏心率。
var dLat = GPS.transformLat(lon - 105.0, lat - 35.0);
var dLon = GPS.transformLon(lon - 105.0, lat - 35.0);
var radLat = lat / 180.0 * GPS.PI;
var magic = Math.sin(radLat);
magic = 1 - ee * magic * magic;
var sqrtMagic = Math.sqrt(magic);
dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * GPS.PI);
dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * GPS.PI);
return { 'lat': dLat, 'lon': dLon };
},
//WGS-84 to GCJ-02
gcj_encrypt: function (wgsLat, wgsLon) {
// 31.000, 119.000
if (GPS.outOfChina(wgsLat, wgsLon)) {
return { 'lat': wgsLat, 'lon': wgsLon };
}
var d = GPS.delta(wgsLat, wgsLon);
return { 'lat': wgsLat + d.lat, 'lon': wgsLon + d.lon };
},
//GCJ-02 to WGS-84
gcj_decrypt: function (gcjLat, gcjLon) {
if (GPS.outOfChina(gcjLat, gcjLon))
return { 'lat': gcjLat, 'lon': gcjLon };
var d = GPS.delta(gcjLat, gcjLon);
return { 'lat': gcjLat - d.lat, 'lon': gcjLon - d.lon };
},
//GCJ-02 to WGS-84 exactly
gcj_decrypt_exact: function (gcjLat, gcjLon) {
var initDelta = 0.01;
var threshold = 0.000000001;
var dLat = initDelta, dLon = initDelta;
var mLat = gcjLat - dLat, mLon = gcjLon - dLon;
var pLat = gcjLat + dLat, pLon = gcjLon + dLon;
var wgsLat, wgsLon, i = 0;
while (1) {
wgsLat = (mLat + pLat) / 2;
wgsLon = (mLon + pLon) / 2;
var tmp = GPS.gcj_encrypt(wgsLat, wgsLon)
dLat = tmp.lat - gcjLat;
dLon = tmp.lon - gcjLon;
if ((Math.abs(dLat) < threshold) && (Math.abs(dLon) < threshold))
break;
if (dLat > 0) pLat = wgsLat; else mLat = wgsLat;
if (dLon > 0) pLon = wgsLon; else mLon = wgsLon;
if (++i > 10000) break;
}
//console.log(i);
return { 'lat': wgsLat, 'lon': wgsLon };
},
//GCJ-02 to BD-09
bd_encrypt: function (gcjLat, gcjLon) {
//console.log(JSON.stringify(arguments))
var x = gcjLon, y = gcjLat;
var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * GPS.x_pi);
var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * GPS.x_pi);
var bdLon = z * Math.cos(theta) + 0.0065;
var bdLat = z * Math.sin(theta) + 0.006;
return { 'lat': bdLat, 'lon': bdLon };
},
//BD-09 to GCJ-02
bd_decrypt: function (bdLat, bdLon) {
var x = bdLon - 0.0065, y = bdLat - 0.006;
var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * GPS.x_pi);
var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * GPS.x_pi);
var gcjLon = z * Math.cos(theta);
var gcjLat = z * Math.sin(theta);
return { 'lat': gcjLat, 'lon': gcjLon };
},
//WGS-84 to Web mercator
//mercatorLat -> y mercatorLon -> x
mercator_encrypt: function (wgsLat, wgsLon) {
var x = wgsLon * 20037508.34 / 180.;
var y = Math.log(Math.tan((90. + wgsLat) * GPS.PI / 360.)) / (GPS.PI / 180.);
y = y * 20037508.34 / 180.;
return { 'lat': y, 'lon': x };
/*
if ((Math.abs(wgsLon) > 180 || Math.abs(wgsLat) > 90))
return null;
var x = 6378137.0 * wgsLon * 0.017453292519943295;
var a = wgsLat * 0.017453292519943295;
var y = 3189068.5 * Math.log((1.0 + Math.sin(a)) / (1.0 - Math.sin(a)));
return {'lat' : y, 'lon' : x};
//*/
},
// Web mercator to WGS-84
// mercatorLat -> y mercatorLon -> x
mercator_decrypt: function (mercatorLat, mercatorLon) {
var x = mercatorLon / 20037508.34 * 180.;
var y = mercatorLat / 20037508.34 * 180.;
y = 180 / GPS.PI * (2 * Math.atan(Math.exp(y * GPS.PI / 180.)) - GPS.PI / 2);
return { 'lat': y, 'lon': x };
/*
if (Math.abs(mercatorLon) < 180 && Math.abs(mercatorLat) < 90)
return null;
if ((Math.abs(mercatorLon) > 20037508.3427892) || (Math.abs(mercatorLat) > 20037508.3427892))
return null;
var a = mercatorLon / 6378137.0 * 57.295779513082323;
var x = a - (Math.floor(((a + 180.0) / 360.0)) * 360.0);
var y = (1.5707963267948966 - (2.0 * Math.atan(Math.exp((-1.0 * mercatorLat) / 6378137.0)))) * 57.295779513082323;
return {'lat' : y, 'lon' : x};
//*/
},
// two point's distance
distance: function (latA, lonA, latB, lonB) {
// var earthR = 6371000.;
// var x = Math.cos(latA * GPS.PI / 180.) * Math.cos(latB * GPS.PI / 180.) * Math.cos((lonA - lonB) * GPS.PI / 180);
// var y = Math.sin(latA * GPS.PI / 180.) * Math.sin(latB * GPS.PI / 180.);
// var s = x + y;
// if (s > 1) s = 1;
// if (s < -1) s = -1;
// var alpha = Math.acos(s);
// var distance = alpha * earthR;
// return distance;
var radLat1 = latA * Math.PI / 180.0;
var radLat2 = latB * Math.PI / 180.0;
var a = radLat1 - radLat2;
var b = lonA * Math.PI / 180.0 - lonB * Math.PI / 180.0;
var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
s = s * 6378.137;// EARTH_RADIUS;
s = Math.round(s * 10000) / 10000;
return s;
},
outOfChina: function (lat, lon) {
if (lon < 72.004 || lon > 137.8347) return true;
if (lat < 0.8293 || lat > 55.8271) return true;
return false;
},
transformLat: function (x, y) {
var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x));
ret += (20.0 * Math.sin(6.0 * x * GPS.PI) + 20.0 * Math.sin(2.0 * x * GPS.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(y * GPS.PI) + 40.0 * Math.sin(y / 3.0 * GPS.PI)) * 2.0 / 3.0;
ret += (160.0 * Math.sin(y / 12.0 * GPS.PI) + 320 * Math.sin(y * GPS.PI / 30.0)) * 2.0 / 3.0;
return ret;
},
transformLon: function (x, y) {
var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
ret += (20.0 * Math.sin(6.0 * x * GPS.PI) + 20.0 * Math.sin(2.0 * x * GPS.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(x * GPS.PI) + 40.0 * Math.sin(x / 3.0 * GPS.PI)) * 2.0 / 3.0;
ret += (150.0 * Math.sin(x / 12.0 * GPS.PI) + 300.0 * Math.sin(x / 30.0 * GPS.PI)) * 2.0 / 3.0;
return ret;
},
getLocation: function (callback) {
var aMap = api.require('aMap');
aMap.open({
rect: {
x: 0,
y: 0,
w: 0,
h: 0
},
showUserLocation: true,
zoomLevel: 11,
fixed: true
}, function (ret, err) {
if (ret.status) {
aMap.getLocation(function (ret, err) {
if (ret) {
if (ret.status) {
callback(ret);
} else {
// alert(JSON.stringify(err));
}
} else {
// alert(JSON.stringify(err))
}
aMap.close();
});
// alert(JSON.stringify(ret));
} else {
// alert(JSON.stringify(err));
}
});
}
}
var marker;
var markerReady;
var polyLineNow;
var size = new BMap.Size(20, 20);
var icon = new BMap.Icon("img/point.svg", size, { imageSize: new BMap.Size(20, 20) });
function receiveData(type, data) {
//console.log(JSON.stringify(arguments));
objName_receiveData(type, data);
}
var mapObj = new Vue({
el: "#map",
data: {
location: {
lng: "121.6488188",
lat: "31.2306319",
},
dragPoint: {
lng: "121.6488188",
lat: "31.2306319",
},
zoomStatus: undefined,
center: true,
IsShowTargetLineStatus: false,
tableShow: false,
nowLocationArr: [],
isShowNowLine: true,
polyLine: undefined,
polyLineNow: undefined
},
methods: {},
watch: {
'location': {
handler: function (newVal, oldVal) {
if (this.center == true) {
var point = null;
point = new BMap.Point(this.location.lng, this.location.lat);
//实时显示位置
map.setCenter(point);
}
if (marker != undefined) {
var point = null;
point = new BMap.Point(this.location.lng, this.location.lat);
map.removeOverlay(marker);
}
map.setZoom(17);
var point = null;
point = new BMap.Point(this.location.lng, this.location.lat);
marker = null;
marker = new BMap.Marker(point); // 创建标注
marker.disableMassClear();
map.addOverlay(marker); // 将标注添加到地图中
mapObj.nowLocationArr.push(point);
//判断已走轨迹是否已经超过2000个点
// if (mapObj.nowLocationArr.length > 2000) {
// mapObj.nowLocationArr.shift();
// }
//判断地点是否在广德
// var mapLocation = null;
// mapLocation = new BMap.Geocoder();
// mapLocation.getLocation(point, function (ret) {
// if (ret && ret.addressComponents.city == "宣城市") {
// map.setMaxZoom(17);
// } else {
// map.setMaxZoom(22);
// }
// });
//已走轨迹
if (mapObj.polyLineNow && mapObj.polyLineNow.Lr != undefined) {
map.removeOverlay(mapObj.polyLineNow);
}
mapObj.polyLineNow = new BMap.Polyline(mapObj.nowLocationArr, { strokeColor: "red", strokeWeight: 3, strokeOpacity: 0.5, strokeStyle: "solid" });
map.addOverlay(mapObj.polyLineNow);
if (mapObj.isShowNowLine == true) {
mapObj.polyLineNow.show();
} else {
mapObj.polyLineNow.hide();
}
// if (polyLineNow && polyLineNow.Lr != undefined) {
// polyLineNow = null;
// map.removeOverlay(polyLineNow);
// }
// polyLineNow = null;
// //polyLineNow = new BMap.Polyline(mapObj.nowLocationArr, { strokeColor: "red", strokeWeight: 3, strokeOpacity: 0.5, strokeStyle: "solid" });
// map.addOverlay(polyLineNow);
// if (mapObj.isShowNowLine == true) {
// polyLineNow.show();
// } else {
// polyLineNow.hide();
// }
// addoverlay 一次
// 500 测shift
},
deep: true,
},
"dragPoint": {
handler: function (newVal, oldVal) {
if (mapObj.center == true) {
if ((mapObj.dragPoint.lng != mapObj.location.lng) || (mapObj.dragPoint.lat != mapObj.location.lat)) {
//console.log(JSON.stringify(mapObj.dragPoint));
//console.log(JSON.stringify(mapObj.location));
var point = new BMap.Point(this.location.lng, this.location.lat);
//console.log(JSON.stringify(point));
//实时显示位置
setTimeout(() => {
map.setCenter(point);
}, 200)
}
}
},
deep: true
},
"zoomStatus": {
handler: function (newVal, oldVal) {
if (mapObj.center == true) {
//console.log(JSON.stringify(mapObj.dragPoint));
//console.log(JSON.stringify(mapObj.location));
var point = new BMap.Point(this.location.lng, this.location.lat);
//console.log(JSON.stringify(point));
//实时显示位置
setTimeout(() => {
map.setCenter(point);
}, 200)
}
},
deep: true
},
},
});
var info = new Vue({
el: "#info",
data: {
tableShow: false,
tableOrign: "",
signalListTitle: [],
signalListdetail: [],
index: undefined,
},
methods: {
receiveDataClick: function (type, data) {
if ((this.index == data) && (this.index != undefined)) {
//console.log(type, data);
this.index = undefined;
receiveData("row", "-1");
return;
} else {
//console.log(type, data);
receiveData("row", String(data));
}
this.index = data;
}
},
watch: {
'tableOrign': {
handler: function (newVal, oldVal) {
if (oldVal == "") {
//alert("11111")
showSignal(true);
}
//console.log("hahaha",newVal)
var signalTotal = this.tableOrign.split(";");
var oldLen = oldVal.split(";").length;
var newLen = newVal.split(";").length;
if (newLen != oldLen) {
info.index = undefined;
}
info.signalListTitle = [];
info.signalListdetail = [];
for (var i = 0; i < signalTotal.length; i++) {
info.signalListTitle.push(signalTotal[i].split(",")[0]);
info.signalListdetail.push(signalTotal[i].split(",")[1]);
}
},
deep: true,
},
},
});
var map = new BMap.Map('map', { minZoom: 4, maxZoom: 17, enableMapClick: false, showZoomControls: false, mapType: BMAP_SATELLITE_MAP });
map.addEventListener("dragend", function (evt) {
//console.log(JSON.stringify(evt.point));
mapObj.dragPoint = evt.point;
});
map.addEventListener("zoomend", function (evt) {
//alert(map.getZoom());
mapObj.zoomStatus = map.getZoom();
//console.log(JSON.stringify(e));
});
map.setZoom(17);
window.onresize = function () {
if(mapObj.center == true){
setTimeout(()=>{
setCenter(true);
},200);}
}
//传经纬度
function getLocation(lat, lon) {
//mapObj.location.lat = lat;//纬度
//mapObj.location.lng = lng;//经度
//纠偏
//var realLocGD = GPS.gcj_encrypt(lat, lon);
//alert(JSON.stringify(realLocGD));
//var realLocBD = GPS.bd_encrypt(realLocGD.lat, realLocGD.lon);
function translateCallback(data) {
mapObj.location.lat = data.points[0].lat;
mapObj.location.lng = data.points[0].lng;
//console.log(mapObj.nowLocationArr);
}
var ggPoint = new BMap.Point(lon, lat);
//console.log(ggPoint);
var convertor = new BMap.Convertor();
var pointArr = [];
pointArr.push(ggPoint);
//console.log(JSON.stringify(pointArr));
convertor.translate(pointArr, 1, 5, translateCallback)
if (mapObj.center == true) {
var point = new BMap.Point(mapObj.location.lng, mapObj.location.lat);
//实时显示位置
map.setCenter(point);
}
//console.log(JSON.stringify( realLoc));
//console.log(lat,lng);
};
//居中
function setCenter(ret) {
if (ret == true) {
mapObj.center = true;
var point = new BMap.Point(mapObj.location.lng, mapObj.location.lat);
//console.log(JSON.stringify(point));
//实时显示位置
map.setCenter(point);
} else {
mapObj.center = false;
}
}
//传轨迹点
function showTargetLine(ret) {
if (ret == undefined) {
return
}
//更新目标轨迹
if (mapObj.polyLine != "") {
map.clearOverlays();
}
//轨迹点纠偏
var ggPoints = [];
var rets = ret.split(";");
//console.log(rets);
//alert(JSON.stringify(rets.length));
for (var i = 0; i < rets.length; i++) {
var lng = Number(rets[i].split(",")[0]);
var lat = Number(rets[i].split(",")[1]);
//console.log(lng,lat);
var locationGCJ = GPS.gcj_encrypt(lat, lng);
var locationGBD = GPS.bd_encrypt(locationGCJ.lat, locationGCJ.lon);
//console.log(JSON.stringify(locationGBD))
ggPoints.push(new BMap.Point(locationGBD.lon, locationGBD.lat));
};
//console.log(ggPoints);
//mapObj.polyLine = "1";
//ggPoints.length = 10
mapObj.polyLine = new BMap.Polyline(ggPoints, { strokeColor: "blue", strokeWeight: 2, strokeOpacity: 1 });
map.addOverlay(mapObj.polyLine);
}
//是否显示目标轨迹
function IsShowTargetLine(ret) {
//true 画轨迹 ; false 清除轨迹
if (ret) {
mapObj.IsShowTargetLineStatus = true;
mapObj.polyLine && mapObj.polyLine.show();
} else {
mapObj.IsShowTargetLineStatus = false;
mapObj.polyLine && mapObj.polyLine.hide();
}
}
//是否显示信号
function showSignal(ret) {
//alert(ret + JSON.stringify(info.tableOrign))
if (ret && info.tableOrign != "") {
info.tableShow = true
} else {
info.tableShow = false
}
}
//信号数据
function setSignalValue(ret) {
//alert(JSON.stringify(ret));
if (ret != "") {
info.tableOrign = ret;
} else {
info.signalListTitle = [];
info.signalListdetail = [];
info.tableShow = false;
info.tableOrign = ''
}
}
//是否显示当前已走轨迹
function isShowNowLine(ret) {
if (ret) {
mapObj.isShowNowLine = true;
mapObj.polyLineNow.show();
//map.addOverlay(mapObj.polyLineNow);
} else {
// alert(JSON.stringify(ret));
//console.log(mapObj.nowLocationArr)
mapObj.isShowNowLine = false;
mapObj.nowLocationArr = [];
map.removeOverlay(mapObj.polyLineNow);
// console.log( mapObj.nowLocationArr)
// map.removeOverlay(mapObj.polyLineNow);
//manObj.polyLineNow = undefined;
mapObj.polyLineNow.hide();
}
};
//lng: "121.6488188",
// lat: "31.2306319",
let xx = 121.6488188;
let yy = 31.2306319;
function lala() {
xx = xx+0.00001;
yy = yy+0.00001;
mapObj.location.lat = yy;
mapObj.location.lng = xx;
}
setInterval("lala()",100);
var point = new BMap.Point(121.424362, 31.175942);
map.centerAndZoom(point, 11);
map.enableDragging(true);
map.enableScrollWheelZoom(true);
// map.enableDoubleClickZoom(true);
map.enableKeyboard(false);
// map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_TOP_LEFT, type: BMAP_NAVIGATION_CONTROL_LARGE }));
map.addControl(new BMap.MapTypeControl({ mapTypes: [BMAP_NORMAL_MAP, BMAP_SATELLITE_MAP], anchor: BMAP_ANCHOR_TOP_LEFT }));
//var ctrlTra = new BMapLib.TrafficControl({ showPanel: false });
//ctrlTra.setAnchor(BMAP_ANCHOR_BOTTOM_RIGHT);
//map.addControl(ctrlTra);
function getPoints(points) {
var pts = []
var listPoint = points.split('|');
var len = listPoint.length
for (var i = 0; i < len; i++) {
var list = listPoint[i].split(',');
var pot = new BMap.Point(list[0], list[1]);
pts.push(pot);
}
return pts;
}
function getMarkers(points) {
var markers = []
var listPoint = points.split('|');
var len = listPoint.length
for (var i = 0; i < len; i++) {
var list = listPoint[i].split(',');
var pot = new BMap.Point(list[0], list[1]);
var marker = new BMap.Marker(pot);
markers.push(marker);
}
return markers;
}
function getBounds() {
var bs = map.getBounds();
var bssw = bs.getSouthWest();
var bsne = bs.getNorthEast();
var bsce = bs.getCenter();
var rect = bssw.lng + ',' + bssw.lat + ',' + bsne.lng + ',' + bsne.lat + ',' + bsce.lng + ',' + bsce.lat + ',' + map.getZoom();
receiveData('bounds', rect);
}
function getBoundary() {
for (var i = 0; i < polygons.length; i++) {
var polyline = polygons[i];
var pts = polyline.getPath();
var result = '';
for (var j = 0; j < pts.length; j++) {
result += pts[j].lng + ',' + pts[j].lat + ';';
}
receiveData('newboundary', result);
}
}
function getZoom() {
var zoom = map.getZoom();
receiveData('zoom', zoom);
}
var geo = new BMap.Geocoder();
function getPointByAddr(addr) {
geo.getPoint(addr, function (result) {
if (result) {
receiveData('geocoder', result.lng + ',' + result.lat);
}
});
}
function getAddrByPoint(point) {
var list = point.split(',');
var pot = new BMap.Point(list[0], list[1]);
geo.getLocation(pot, function (result) {
if (result) {
receiveData('geocoder', result.address);
}
});
}
function addClick(marker, name, addr, title, tips, width, action) {
if (title == '' && name != '') {
title = '<div style="color:#CE5521;font-size:15px;">' + name + '</div>';
}
if (tips == '' && addr != '') {
tips = '<table><tr style="vertical-align:top;line-height:25px;font-size:12px;"><td>地址:</td><td>' + addr + '</td></tr></table>';
}
var infoWindow = new BMap.InfoWindow(tips, { title: title, width: width });
var markerClick = function () {
if (action == 1) {
marker.openInfoWindow(infoWindow);
} else if (action == 2) {
receiveData('marker', '名称: ' + name + ' 地址: ' + addr);
}
};
marker.addEventListener('click', markerClick);
}
function addMarker(name, addr, title, tips, width, point, action, animation, iconfile, iconindex) {
alert(123); var list = point.split(',');
var pot = new BMap.Point(list[0], list[1]);
var label = new BMap.Label(name, { "offset": new BMap.Size(20, -10) });
if (!iconfile) {
var marker = new BMap.Marker(pot);
} else if (iconfile == 'http://lbsyun.baidu.com/jsdemo/img/fox.gif') {
var icon = new BMap.Icon(iconfile, new BMap.Size(300, 157));
var marker = new BMap.Marker(pot, { icon: icon });
} else if (iconfile == 'http://api.map.baidu.com/img/markers.png') {
var icon = new BMap.Icon(iconfile, new BMap.Size(23, 25), { offset: new BMap.Size(10, 25), imageOffset: new BMap.Size(0, 0 - iconindex * 25) });
var marker = new BMap.Marker(pot, { icon: icon });
} else {
var icon = new BMap.Icon(iconfile, new BMap.Size(53, 52));
var marker = new BMap.Marker(pot, { icon: icon });
}
map.addOverlay(marker);
if (name != '') {
marker.setLabel(label);
}
addClick(marker, name, addr, title, tips, width, action);
if (animation == 1) {
marker.setAnimation(BMAP_ANIMATION_BOUNCE);
} else if (animation == 2) {
marker.setAnimation(BMAP_ANIMATION_DROP);
}
}
function deleteMarker(name) {
var allOverlay = map.getOverlays();
var len = allOverlay.length;
for (var i = 0; i < len; i++) {
var overlay = allOverlay[i];
if (overlay.toString() != '[object Marker]') {
continue;
}
if (name.length == 0) {
map.removeOverlay(overlay);
} else {
var label = overlay.getLabel();
if (label == null) {
continue;
}
if (label.content == name) {
map.removeOverlay(allOverlay[i]);
break;
}
}
}
}
function deleteOverlay(type) {
var allOverlay = map.getOverlays();
var len = allOverlay.length;
for (var i = 0; i < len; i++) {
var overlay = allOverlay[i];
if (type.length == 0) {
map.removeOverlay(overlay);
} else {
var strType = '[object ' + type + ']'
if (overlay.toString() == strType) {
map.removeOverlay(overlay);
}
}
}
}
function addPolyline(points) {
var pts = getPoints(points);
var polyline = new BMap.Polyline(pts, { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
map.addOverlay(polyline);
}
function addPolygon(points) {
var pts = getPoints(points);
var polygon = new BMap.Polygon(pts, { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
map.addOverlay(polygon);
}
function addRectangle(points) {
var listPoint = points.split('|');
if (listPoint.length != 2) {
return;
}
var list1 = listPoint[0].split(',');
var list2 = listPoint[1].split(',');
var ptStart = new BMap.Point(list1[0], list1[1]);
var ptEnd = new BMap.Point(list2[0], list2[1]);
var pt1 = new BMap.Point(ptStart.lng, ptStart.lat);
var pt2 = new BMap.Point(ptEnd.lng, ptStart.lat);
var pt3 = new BMap.Point(ptEnd.lng, ptEnd.lat);
var pt4 = new BMap.Point(ptStart.lng, ptEnd.lat);
var rectangle = new BMap.Polygon([pt1, pt2, pt3, pt4], { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
map.addOverlay(rectangle);
}
function addCircle(points, radius) {
var listPoint = points.split('|');
var list = listPoint[0].split(',');
var ptCenter = new BMap.Point(list[0], list[1]);
var circle = new BMap.Circle(ptCenter, radius, { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
map.addOverlay(circle);
}
function addCurveLine(points) {
var pts = getPoints(points);
var curveLine = new BMapLib.CurveLine(pts, { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
map.addOverlay(curveLine);
curveLine.enableEditing();
}
var polygons = [];
function addBoundary(cityname, callfun, edit) {
map.clearOverlays();
var bdary = new BMap.Boundary();
bdary.get(cityname, function (rs) {
var count = rs.boundaries.length;
if (count > 0) {
if (callfun) {
receiveData('boundary', rs.boundaries);
}
var pointArray = [];
for (var i = 0; i < count; i++) {
var ply = new BMap.Polygon(rs.boundaries[i], { strokeColor: "#FF0000", strokeWeight: 3, strokeOpacity: 0.5 });
if (edit) {
ply.enableEditing();
}
polygons.push(ply);
map.addOverlay(ply);
pointArray = pointArray.concat(ply.getPath());
}
map.setViewport(pointArray);
}
});
}
function addMarkerClusterer(points) {
alert(123); var markers = getMarkers(points);
var markerClusterer = new BMapLib.MarkerClusterer(map, { markers: markers });
}
var overlays = [];
var overlaycomplete = function (e) {
overlays.push(e.overlay);
};
var styleOptions = {
strokeColor: "red",
fillColor: "red",
strokeWeight: 3,
strokeOpacity: 0.8,
fillOpacity: 0.6,
strokeStyle: 'solid'
}
function clearAll() {
for (var i = 0; i < overlays.length; i++) {
map.removeOverlay(overlays[i]);
}
overlays.length = 0;
}
</script>
</html>
<!-- "121.65102530,31.23234760"
"121.65164430,31.23264980"
"121.65164200,31.23264920"
"121.65163970,31.23264860"
"121.65161010,31.23264090"
"121.65160780,31.23264030"
"121.65160560,31.23263970"
"121.65160330,31.23263910" -->
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论