规划驾车路线和途径点及判断车辆路线偏移

2020-02-24 18:48:34

参考地址 规划驾车路线和途径点及判断车辆路线偏移

仅供参考,我还是推荐用矩形判断,嘿嘿。

star: 项目需求需要利用百度地图构建路线并支持设置途径点,以及可以实时监控车辆是否偏移路线;两种方案。


写了比较完整的注释了,替换ak可直接看效果,规划驾车路线和途径点及判断车辆路线偏移 源码:


方法一:


<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>规划驾车路线和途径点及判断车辆位置偏移</title>

</head>

<body>

<div id="allmap"></div>

</body>

</html>

<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>

<!-- 判断点在线范围内 -->

<script type="text/javascript" src="../js/GeoUtils.js"></script>

<script type="text/javascript">

// 百度地图API功能

var map = new BMap.Map("allmap");

map.centerAndZoom(new BMap.Point(116.404, 39.915), 13);

map.addControl(new BMap.NavigationControl()); // 添加平移缩放控件

map.addControl(new BMap.ScaleControl()); // 添加比例尺控件

map.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件

map.enableScrollWheelZoom(true);

 

//起点-终点

var startSpot = new BMap.Point(116.434913, 39.851941);

var endSpot = new BMap.Point(116.528038, 39.789194);

 

//途径点

var waypointsList = new Array();

waypointsList.push(new BMap.Point(116.456172, 39.833542));

// waypointsList.push(new BMap.Point(116.501384, 39.832991));

// waypointsList.push(new BMap.Point(116.53353, 39.802379));

 

// 车辆动态坐标点

var dynamicZb = new BMap.Point(116.382997,39.791302);

 

//清除地图上所有的覆盖物

// map.clearOverlays();

//创建驾车实例

var driving = new BMap.DrivingRoute(map);

// 判断有无途径点

if (waypointsList.length > 0) {

//第一个驾车搜索(开始路段)

driving.search(startSpot, waypointsList[0]);

// 途径点路段

for (var i = 0; i < waypointsList.length - 1; i++) {

driving.search(waypointsList[i], waypointsList[i + 1]);

}

//第二个驾车搜索(终止路段)

driving.search(waypointsList[waypointsList.length - 1], endSpot);

} else {

driving.search(startSpot, endSpot);

}

 

//通过驾车实例,获得一系列点的数组

var zbList = new Array();

// 多路段坐标临时变量

var zbLinshi;

/**

* 路段数统计(与途径点(数组长度+1) 拿到完整坐标点数)

* 如:1,2,3,4 起点终点:1/4   途径点:2/3  需绘画3次路段

*/

var routeCount = 0;

driving.setSearchCompleteCallback(function() {

routeCount++;

console.log("路段数:" + routeCount);

 

var pts = driving.getResults().getPlan(0).getRoute(0).getPath();

//通过驾车实例,获得一系列点的数组       

var polyline = new BMap.Polyline(pts);

zbLinshi = polyline.getPath();

 

console.log("多路段坐标点数:" + zbLinshi.length);

// 将多个路段坐标点放入集合

for (var i = 0; i < zbLinshi.length; i++) {

// zbList.push("new BMap.Point("+zbLinshi[i].lng);

// zbList.push(zbLinshi[i].lat+")");

            zbList.push(zbLinshi[i]);

// console.log(zbLinshi[i]);

}

 

 

map.addOverlay(polyline);

//创建marker 

var m1 = new BMap.Marker(startSpot);

var m2 = new BMap.Marker(endSpot);

map.addOverlay(m1);

map.addOverlay(m2);

if (waypointsList.length > 0) {

for (var i = 0; i < waypointsList.length; i++) {

map.addOverlay(new BMap.Marker(waypointsList[i]));

}

}

 

//创建个label    

var lab1 = new BMap.Label("起点", {

position: startSpot

});

var lab2 = new BMap.Label("终点", {

position: endSpot

});

map.addOverlay(lab1);

map.addOverlay(lab2);

if (waypointsList.length > 0) {

for (var i = 0; i < waypointsList.length; i++) {

map.addOverlay(new BMap.Label("途径点" + (i + 1), {

position: waypointsList[i]

}));

}

}

 

// setTimeout(function() {

var viewPorts = new Array();

viewPorts.push(startSpot);

if (waypointsList.length > 0) {

for (var i = 0; i < waypointsList.length; i++) {

viewPorts.push(waypointsList[i]);

}

}

viewPorts.push(endSpot);

map.setViewport(viewPorts);

 

//调整到最佳视野        

// }, 1000);

});

 

 

 

 

/*  实时监测返回状态

BMAP_STATUS_SUCCESS 检索成功。对应数值“0”

BMAP_STATUS_CITY_LIST 城市列表。对应数值“1”

BMAP_STATUS_UNKNOWN_LOCATION 位置结果未知。对应数值“2”

BMAP_STATUS_UNKNOWN_ROUTE 导航结果未知。对应数值“3”

BMAP_STATUS_INVALID_KEY 非法密钥。对应数值“4”

BMAP_STATUS_INVALID_REQUEST 非法请求。对应数值“5”

BMAP_STATUS_PERMISSION_DENIED 没有权限。对应数值“6”

BMAP_STATUS_SERVICE_UNAVAILABLE 服务不可用。对应数值“7”

BMAP_STATUS_TIMEOUT 超时。对应数值“8” */

var checkgetStatus = setInterval(function() {

if (driving.getStatus() == 0 && waypointsList.length + 1 == routeCount) {

// 返回成功终止检测

clearInterval(checkgetStatus);

console.log("---保存坐标数组----:" + zbList);

//判断路线偏移

CheckRouteDeviation(dynamicZb, zbList, 200);

}

}, 1000);

 

/*

  (判断路线偏移)点是否在线上(通过以每个坐标点为圆心,自定以半径范围;检测某个坐标点是否在圆中)

  dynamicZb:要判断的坐标;zbList:线路坐标数组;radius:半径范围

    */

function CheckRouteDeviation(dynamicZb, zbList, radius) {

var circles = [];

//遍历坐标集合,以每一个坐标点为圆心,创建圆

for (var i = 0; i < zbList.length; i++) {

var c = zbList[i]; //圆心 

//测试圆 radius代表圆的半径距离 单位:米

var circle = new BMap.Circle(c, radius);

circles.push(circle);

// 绘画圆

map.addOverlay(circle);

}

// console.log("测试圆:" + circles);

 

//循环遍历判断车辆当前坐标点是否在圆里

var flag = false;

for (var i = 0; i < circles.length; i++) {

//point:当前坐标点、circles[i]:规划好的圆

var result = BMapLib.GeoUtils.isPointInCircle(dynamicZb, circles[i]);

if (result == true) { //true:点是在圆圈里

flag = true;

break;

}

}

console.log("点是否在线路上(是否在线路坐标点圆中):" + flag);

}

 

 

$(function() {

// ptInCircle();

})

 

// ----------------------------------------- 未用 ----------------------------

//点在圆内

function ptInCircle() {

var pt = new BMap.Point(116.404, 39.915); //测试点

var c = new BMap.Point(116.404, 39.915); //圆心 

var circle = new BMap.Circle(c, 500); //测试圆

 

var result = BMapLib.GeoUtils.isPointInCircle(pt, circle);

if (result == true) {

// alert("点在圆形内");

} else {

// alert("点在圆形外")

}

 

//演示:将点与圆形添加到地图上

// map.clearOverlays();

// var mkr = new BMap.Marker(pt);

// map.addOverlay(mkr);

map.addOverlay(circle);

}

 

//点在圆外

function ptOutCircle() {

var pt = new BMap.Point(116.396, 39.915); //测试点

var c = new BMap.Point(116.404, 39.915); //圆心 

var circle = new BMap.Circle(c, 500); //测试圆        

 

var result = BMapLib.GeoUtils.isPointInCircle(pt, circle);

if (result == true) {

alert("点在圆形内");

} else {

alert("点在圆形外")

}

 

//演示:将点与圆形添加到地图上

map.clearOverlays();

var mkr = new BMap.Marker(pt);

map.addOverlay(mkr);

map.addOverlay(circle);

}

</script>

方法二:


<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>整合修改官方驾车路线途经点途径点demo</title>

</head>

<body>

<div id="allmap"></div>

</body>

</html>

<script type="text/javascript">

// 百度地图API功能

var map = new BMap.Map("allmap");

map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

map.enableScrollWheelZoom(true);

 

var p1 = new BMap.Point(116.301934, 39.977552);

var p2 = new BMap.Point(116.508328, 39.919141);

// 途径点

var t1= new BMap.Point(116.365942, 39.996165);

var t2 = new BMap.Point(116.408757, 39.995704);

var waypointsList = [t1,t2];

var driving = new BMap.DrivingRoute(map, {

renderOptions: {

map: map,

autoViewport: true

}

});

driving.search(p1, p2, {

waypoints: waypointsList

}); //waypoints表示途经点

 

 

// 多路段坐标临时变量

var zbList = [];

driving.setSearchCompleteCallback(function() {

// 取出每段路坐标点数组

for (var i = 0; i <= waypointsList.length; i++) {

var pts = driving.getResults().getPlan(0).getRoute(i).getPath();

var zbLinshi = new BMap.Polyline(pts).getPath();

console.log("多路段坐标点数:" + zbLinshi.length);

// 多段路坐标点整合

zbList = zbList.concat(zbLinshi);

}

console.log("多路段坐标点数:" + zbList.length);

for (var i = 0; i < zbList.length; i++) {

console.log(zbList[i].lng+","+zbList[i].lat);

}

}

);

 

 

 

 

    // 坐标点画圆展示

var checkgetStatus = setInterval(function() {

if (driving.getStatus() == 0) {

// 返回成功终止检测

clearInterval(checkgetStatus);

// 画圆

CheckRouteDeviation(0, zbList, 200);

}

}, 1000);

 

 

//  画圆

function CheckRouteDeviation(dynamicZb, zbList, radius) {

var circles = [];

//遍历坐标集合,以每一个坐标点为圆心,创建圆

for (var i = 0; i < zbList.length; i++) {

var c = zbList[i]; //圆心 

//测试圆 radius代表圆的半径距离 单位:米

var circle = new BMap.Circle(c, radius);

circles.push(circle);

// 绘画圆

map.addOverlay(circle);

}

// console.log("测试圆:" + circles);

 

// //循环遍历判断车辆当前坐标点是否在圆里

// var flag = false;

// for (var i = 0; i < circles.length; i++) {

// //point:当前坐标点、circles[i]:规划好的圆

// var result = BMapLib.GeoUtils.isPointInCircle(dynamicZb, circles[i]);

// if (result == true) { //true:点是在圆圈里

// flag = true;

// break;

// }

// }

// console.log("点是否在线路上(是否在线路坐标点圆中):" + flag);

}

</script>

通过线路所有坐标点规划路线(回显线路) 源码:


<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 {

width: 100%;

height: 100%;

margin: 0;

font-family: "微软雅黑";

}

 

#allmap {

height: 500px;

width: 100%;

}

</style>

<title>通过坐标点绘画线路</title>

</head>

<body>

<div id="allmap"></div>

</body>

</html>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的百度AK"></script>

<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>

<script type="text/javascript">

// 百度地图API功能

var map = new BMap.Map("allmap");

map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

map.enableScrollWheelZoom(true);

 

//途径点

var waypointsList = new Array();

waypointsList.push(new BMap.Point(116.456172, 39.833542));

waypointsList.push(new BMap.Point(116.501384, 39.832991));

waypointsList.push(new BMap.Point(116.53353, 39.802379));

 

 

$(function() {

var zbList = [

new BMap.Point(116.434896,39.851921),new BMap.Point(116.434825,39.851913),new BMap.Point(116.434654,39.851916),new BMap.Point(116.434172,39.851924),new BMap.Point(116.433598,39.851925),new BMap.Point(116.432602,39.851943),new BMap.Point(116.431988,39.851964),new BMap.Point(116.431737,39.851988),new BMap.Point(116.431486,39.852002),new BMap.Point(116.431264,39.852026),new BMap.Point(116.430902,39.852043),new BMap.Point(116.430399,39.852071),new BMap.Point(116.428398,39.852125),new BMap.Point(116.428177,39.852129),new BMap.Point(116.428177,39.852049),new BMap.Point(116.428176,39.852049),new BMap.Point(116.428165,39.851779),new BMap.Point(116.428165,39.851629),new BMap.Point(116.428165,39.851629),new BMap.Point(116.428155,39.851159),new BMap.Point(116.428113,39.849559),new BMap.Point(116.428102,39.848949),new BMap.Point(116.428092,39.848649),new BMap.Point(116.428082,39.848419),new BMap.Point(116.428061,39.847439),new BMap.Point(116.42803,39.84638),new BMap.Point(116.428029,39.846379),new BMap.Point(116.428019,39.845789),new BMap.Point(116.428019,39.845659),new BMap.Point(116.428019,39.845449),new BMap.Point(116.427987,39.843949),new BMap.Point(116.427997,39.843459),new BMap.Point(116.427997,39.843339),new BMap.Point(116.428007,39.843219),new BMap.Point(116.428027,39.843029),new BMap.Point(116.428077,39.842758),new BMap.Point(116.428097,39.842697),new BMap.Point(116.428267,39.842265),new BMap.Point(116.428267,39.842264),new BMap.Point(116.428286,39.842023),new BMap.Point(116.428437,39.841231),new BMap.Point(116.428437,39.841231),new BMap.Point(116.428456,39.84066),new BMap.Point(116.428416,39.840301),new BMap.Point(116.428365,39.839632),new BMap.Point(116.428345,39.839472),new BMap.Point(116.428314,39.839122),new BMap.Point(116.428324,39.838882),new BMap.Point(116.428334,39.838782),new BMap.Point(116.428404,39.838611),new BMap.Point(116.428615,39.838367),new BMap.Point(116.428977,39.838211),new BMap.Point(116.42947,39.838133),new BMap.Point(116.429762,39.838108),new BMap.Point(116.429902,39.838106),new BMap.Point(116.431864,39.838062),new BMap.Point(116.43287,39.838044),new BMap.Point(116.433001,39.838052),new BMap.Point(116.433514,39.838063),new BMap.Point(116.434037,39.838073),new BMap.Point(116.434359,39.838097),new BMap.Point(116.43443,39.838096),new BMap.Point(116.434742,39.83811),new BMap.Point(116.434822,39.838119),new BMap.Point(116.435175,39.838143),new BMap.Point(116.435607,39.838215),new BMap.Point(116.435607,39.838214),new BMap.Point(116.436432,39.838209),new BMap.Point(116.439642,39.838141),new BMap.Point(116.439783,39.838138),new BMap.Point(116.440095,39.838133),new BMap.Point(116.443797,39.838058),new BMap.Point(116.448301,39.837976),new BMap.Point(116.45005,39.837951),new BMap.Point(116.45005,39.837951),new BMap.Point(116.450462,39.837845),new BMap.Point(116.450954,39.837799),new BMap.Point(116.451908,39.837766),new BMap.Point(116.4524,39.8377),new BMap.Point(116.4524,39.8377),new BMap.Point(116.453414,39.837668),new BMap.Point(116.453997,39.837661),new BMap.Point(116.453997,39.837661),new BMap.Point(116.454067,39.837481),new BMap.Point(116.454167,39.837179),new BMap.Point(116.454607,39.835824),new BMap.Point(116.454868,39.835221),new BMap.Point(116.454918,39.835111),new BMap.Point(116.455058,39.834829),new BMap.Point(116.455218,39.834578),new BMap.Point(116.455449,39.834215),new BMap.Point(116.45583,39.833742),new BMap.Point(116.4561,39.833469),new BMap.Point(116.456101,39.833468),new BMap.Point(116.456311,39.833266),new BMap.Point(116.457073,39.832619),new BMap.Point(116.457815,39.832043),new BMap.Point(116.458276,39.831689),new BMap.Point(116.458336,39.831639),new BMap.Point(116.459718,39.830569),new BMap.Point(116.46088,39.829652),new BMap.Point(116.461,39.829561),new BMap.Point(116.461131,39.829451),new BMap.Point(116.461301,39.82931),new BMap.Point(116.461421,39.829209),new BMap.Point(116.465443,39.826117),new BMap.Point(116.465583,39.826007),new BMap.Point(116.468242,39.823937),new BMap.Point(116.471398,39.821506),new BMap.Point(116.471558,39.821387),new BMap.Point(116.473194,39.820116),new BMap.Point(116.473613,39.819789),new BMap.Point(116.474072,39.819432),new BMap.Point(116.474471,39.819105),new BMap.Point(116.47464,39.818936),new BMap.Point(116.475089,39.81849),new BMap.Point(116.475189,39.818371),new BMap.Point(116.475189,39.818369),new BMap.Point(116.475588,39.817932),new BMap.Point(116.475877,39.817605),new BMap.Point(116.475907,39.817585),new BMap.Point(116.476096,39.817377),new BMap.Point(116.476884,39.816494),new BMap.Point(116.477621,39.815681),new BMap.Point(116.477691,39.815572),new BMap.Point(116.47792,39.815325),new BMap.Point(116.478578,39.814632),new BMap.Point(116.478628,39.814572),new BMap.Point(116.478887,39.814265),new BMap.Point(116.478887,39.814264),new BMap.Point(116.479415,39.81368),new BMap.Point(116.480391,39.812692),new BMap.Point(116.480739,39.812376),new BMap.Point(116.481048,39.81213),new BMap.Point(116.482024,39.811363),new BMap.Point(116.482771,39.810763),new BMap.Point(116.48292,39.810655),new BMap.Point(116.483278,39.810371),new BMap.Point(116.484572,39.80932),new BMap.Point(116.485239,39.80871),new BMap.Point(116.485975,39.807881),new BMap.Point(116.486025,39.807812),new BMap.Point(116.486025,39.807811),new BMap.Point(116.486115,39.807653),new BMap.Point(116.486493,39.807089),new BMap.Point(116.486851,39.806485),new BMap.Point(116.486861,39.806465),new BMap.Point(116.486981,39.806317),new BMap.Point(116.48702,39.806258),new BMap.Point(116.48715,39.80605),new BMap.Point(116.48717,39.80602),new BMap.Point(116.487866,39.804902),new BMap.Point(116.488304,39.80419),new BMap.Point(116.488434,39.803972),new BMap.Point(116.488951,39.803121),new BMap.Point(116.489021,39.803012),new BMap.Point(116.489071,39.802943),new BMap.Point(116.489946,39.801489),new BMap.Point(116.490812,39.800064),new BMap.Point(116.490952,39.799877),new BMap.Point(116.490991,39.799817),new BMap.Point(116.491071,39.799709),new BMap.Point(116.492533,39.798065),new BMap.Point(116.493001,39.797484),new BMap.Point(116.493369,39.797021),new BMap.Point(116.493687,39.796697),new BMap.Point(116.493827,39.79659),new BMap.Point(116.495547,39.794672),new BMap.Point(116.495548,39.79467),new BMap.Point(116.496413,39.793686),new BMap.Point(116.49892,39.790853),new BMap.Point(116.499129,39.790647),new BMap.Point(116.499228,39.790559),new BMap.Point(116.499228,39.790559),new BMap.Point(116.499577,39.790195),new BMap.Point(116.501806,39.787686),new BMap.Point(116.502253,39.787184),new BMap.Point(116.502582,39.78682),new BMap.Point(116.50298,39.786477),new BMap.Point(116.503626,39.786069),new BMap.Point(116.504144,39.785838),new BMap.Point(116.505626,39.785423),new BMap.Point(116.505626,39.785422),new BMap.Point(116.505805,39.785385),new BMap.Point(116.505984,39.785338),new BMap.Point(116.505984,39.785338),new BMap.Point(116.506441,39.785225),new BMap.Point(116.5067,39.785159),new BMap.Point(116.507526,39.784953),new BMap.Point(116.508003,39.78483),new BMap.Point(116.511089,39.784034),new BMap.Point(116.511159,39.784015),new BMap.Point(116.511408,39.783959),new BMap.Point(116.514048,39.783281),new BMap.Point(116.514387,39.783194),new BMap.Point(116.518375,39.782161),new BMap.Point(116.518405,39.782162),new BMap.Point(116.518605,39.782113),new BMap.Point(116.518605,39.782112),new BMap.Point(116.518764,39.782064),new BMap.Point(116.520431,39.781634),new BMap.Point(116.52118,39.781409),new BMap.Point(116.521569,39.781261),new BMap.Point(116.523208,39.780527),new BMap.Point(116.523438,39.780408),new BMap.Point(116.523548,39.780358),new BMap.Point(116.523588,39.780438),new BMap.Point(116.523588,39.780438),new BMap.Point(116.523648,39.780588),new BMap.Point(116.523747,39.780828),new BMap.Point(116.523747,39.780828),new BMap.Point(116.524355,39.782329),new BMap.Point(116.524944,39.78376),new BMap.Point(116.524993,39.78389),new BMap.Point(116.525811,39.78589),new BMap.Point(116.526301,39.78643),new BMap.Point(116.52654,39.78668),new BMap.Point(116.52655,39.786729),new BMap.Point(116.52665,39.786809),new BMap.Point(116.52665,39.786809),new BMap.Point(116.52679,39.786849),new BMap.Point(116.52693,39.786989),new BMap.Point(116.52701,39.787069),new BMap.Point(116.52713,39.787189),new BMap.Point(116.52739,39.787359),new BMap.Point(116.52839,39.787847),new BMap.Point(116.52867,39.787987),new BMap.Point(116.52901,39.788146),new BMap.Point(116.52921,39.788245),new BMap.Point(116.52905,39.788545),new BMap.Point(116.52905,39.788546),new BMap.Point(116.528679,39.789026),new BMap.Point(116.528539,39.789126),new BMap.Point(116.528529,39.789147),new BMap.Point(116.528329,39.789407)

];

drawRoute(map, zbList);

})

 

 

//规划路线

function drawRoute(map, zbList) {

var arrPois = [];

var lineColor = "";

 

//循环遍历数组

for (var i = 0; i < zbList.length - 1; i++) {

//清空数组,如若不清空,会在原来基础上每次在重复的增加一边。这儿是让每两个点画线,否则第二次进来的时候就成四个数据了,第二个重复了一次

arrPois.splice(0, arrPois.length);

//          arrPois.push(this.translateBD(zbList[i].Latitude, zbList[i].Longitude));

//          arrPois.push(this.translateBD(zbList[i + 1].Latitude, zbList[i + 1].Longitude));

arrPois.push(new BMap.Point(zbList[i].lng, zbList[i].lat));

arrPois.push(new BMap.Point(zbList[i + 1].lng, zbList[i + 1].lat));

//区间颜色

// if (zbList[i].Speed < 30) {

// lineColor = "#fed769";

// } else if (zbList[i].Speed > 30 && zbList[i].Speed < 60) {

// lineColor = "#b0e758";

// } else if (zbList[i].Speed > 60 && zbList[i].Speed < 90) {

// lineColor = "#37d49a";

// } else if (zbList[i].Speed > 90 && zbList[i].Speed < 120) {

// lineColor = "#0c9be4";

// } else if (zbList[i].Speed > 120) {

// lineColor = "#960100";

// }

 

//创建线路

window.polyline = new BMap.Polyline(

arrPois, //所有的GPS坐标点

{

// strokeColor: lineColor, //线路颜色

strokeColor: "#7F98C7", //线路颜色

strokeWeight: 4, //线路大小5

strokeOpacity: 1

//线路类型(虚线)

// strokeStyle: "dashed"

});

 

 

//绘制线路

map.addOverlay(polyline);

}

 

//创建marker 

var m1 = new BMap.Marker(zbList[0]);

var m2 = new BMap.Marker(zbList[zbList.length - 1]);

map.addOverlay(m1);

map.addOverlay(m2);

 

//创建label    

var lab1 = new BMap.Label("起点", {

position: zbList[0]

});

var lab2 = new BMap.Label("终点", {

position: zbList[zbList.length - 1]

});

map.addOverlay(lab1);

map.addOverlay(lab2);

}

</script>



  • 2020-11-18 14:34:00

    当你写爬虫抓不到APP请求包的时候该怎么办?

    提示:因为高级篇以后的APP将无法使用很通用的方式处理,每种类型甚至是每个APP的反抓包处理方式都会有差别,所以这个系列以后会以【高级篇-具体类型】的形式来写。

  • 2020-11-21 20:41:51

    Kotlin Sealed class类详解

    Sealed class(密封类) 是一个有特定数量子类的类,看上去和枚举有点类似,所不同的是,在枚举中,我们每个类型只有一个对象(实例);而在密封类中,同一个类可以拥有几个对象。

  • 2020-11-22 20:53:43

    Dagger2之Kotlin写法

    修饰构造方法 修饰变量,在宿主类里,引入要注入的实例

  • 2020-11-22 20:56:13

    Dagger2使用详解

    简单的说,就是一个工厂模式,由Dagger负责创建工厂,帮忙生产instance。遵从Java规范JSR 330,可以使用这些注解。现在不研究Dagger2是如何根据注解去生成工厂的,先来看看工厂是什么东西,理解为什么可以实现了DI(Dependency Injection),如何创建IoC(Inverse of Control)容器。

  • 2020-11-22 21:00:28

    dagger.android--Fragment,BaseFragment

    1 使用Fragment参数来代替Activity参数 2 使用 @FragmentKey来代替@ActivityKey 3 使用HasFragmentInjector来代替@HasActivityInjector 4 AndroidInjection.inject(Fragment)方法,在Fragment的onAttach()中调用,而不是在onCreate()中 5 Fragment的Module添加位置,和Activity是不同的,它取决于Fragment需要的其他依赖注入

  • 2020-11-22 21:12:30

    Dependency Injection with Dagger2,Fragment

    標註@Provides的method若有parameter的話,Dagger會找出其擁有的該型態物件來使用。我們在Module內新增了DataModel將其列入Dagger的管理下,接著在provideFactory()增加parameter變成provideFactory(DataModel dataModel),Dagger就會找出其管理的DataModel給provideFactory使用。

  • 2020-11-22 22:58:52

    Android LiveData Transformations

    有时候有这样的需求,需要在LiveData将变化的数据通知给观察者前,改变数据的类型;或者是返回一个不一样的LiveData。

  • 2020-11-22 23:00:16

    androidx中的lifecycle组件

    Lifecycle-aware components生命周期感知组件执行操作,以响应另一个组件生命周期状态的更改,例如Activity和Fragment。这些组件可以帮助您生成更有组织、更容易维护的轻量级代码。