首页 > 代码库 > 百度地图 路书
百度地图 路书
<!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" /> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/api?v=1.4"></script> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script> <script type="text/javascript" src=http://www.mamicode.com/"http://api.map.baidu.com/library/LuShu/1.2/src/LuShu_min.js"></script> <title>25.1 路书</title></head><body> <div class="wrapper"> <div class="container clearfix"> <div class="clearfix"> <div style="clear: both;"> <div style="float: left; width: 500px; height: 340px; border: 1px solid gray" id="container"> </div> </div> </div> </div> </div></body></html><script type="text/javascript"> var map = new BMap.Map("container"); // 创建map var point = new BMap.Point(116.411053, 39.950507); // 确定中心点 map.centerAndZoom(point, 8); // 初始化地图map,设置中心点和地图级别。 var point1 = new BMap.Point(117.965625, 40.962343); // 起点1 var point2 = new BMap.Point(118.213988, 39.609821); // 中间点2 var point3 = new BMap.Point(117.211335, 39.095608); // 中间点3 var point4 = new BMap.Point(116.723807, 39.53863); // 中间点4 var point5 = new BMap.Point(116.392656, 39.9080114); // 中间点5 var point6 = new BMap.Point(115.509585, 38.865845); // 中间点6 var point7 = new BMap.Point(114.920872, 40.829717); // 中间点7 var point8 = new BMap.Point(117.965625, 40.962343); // 终点8 var points = [point1, point2, point3, point4, point5, point6, point7, point8]; //折线数组 var polyline = new BMap.Polyline(points); //创建折线 map.addOverlay(polyline); //绘制折线 var lushu = new BMapLib.LuShu(map, points, { defaultContent: "", autoView: true, //是否开启自动视野调整，如果开启那么路书在运动过程中会根据视野自动调整 icon: new BMap.Icon(‘car.png‘, new BMap.Size(52, 26), { anchor: new BMap.Size(27, 13) }), enableRotation: true, //是否设置marker随着道路的走向进行旋转 landmarkPois: [] }); lushu.start(); </script>
百度地图 路书
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。