百度地图绘制折线,保存动态读取

使用百度地图绘制地图,并且在地图上绘制折线形成个人轨迹,增加描述与名称,代码如下:

	//百度地图API功能
        map = new BMap.Map("allmap");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);  // 初始化地图,设置中心点坐标和地图级别
	map.setCurrentCity("北京");          // 设置地图显示的城市 此项是必须设置的
	map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
创建百度地图实例,
//添加地图控件
	var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角,添加比例尺
	var top_left_navigation = new BMap.NavigationControl();  //左上角,添加默认缩放平移控件
	var top_right_navigation = new BMap.NavigationControl({anchor: BMAP_ANCHOR_BOTTOM_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}); //右上角,仅包含平移和缩放按钮
	map.addControl(top_left_control);        
	map.addControl(top_left_navigation);     
	map.addControl(top_right_navigation);
在地图上添加空间
	var styleOptions = {
   	        strokeColor:"#4B0082",    //边线颜色。
   	        fillColor:"red",      //填充颜色。当参数为空时,圆形将没有填充效果。
   	        strokeWeight: 3,       //边线的宽度,以像素为单位。
   	        strokeOpacity: 0.8,	   //边线透明度,取值范围0 - 1。
   	        fillOpacity: 0.6,      //填充的透明度,取值范围0 - 1。
   	        strokeStyle: 'solid' //边线的样式,solid或dashed。
   	  }
	 //实例化鼠标绘制工具
	      var drawingManager = new BMapLib.DrawingManager(map, {
	          isOpen: false, //是否开启绘制模式
	          enableDrawingTool: true, //是否显示工具栏
	          drawingToolOptions: {
	              anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
	              offset: new BMap.Size(5, 5), //偏离值
	              drawingModes: [            
	                       BMAP_DRAWING_POLYLINE
	                ]
	          },
	          polylineOptions: styleOptions, //线的样式
	      }); 
绘制折线后,保存为文件,每次动态读取代码如下:
 	var polylinePointsArray = [];
	for(var i = 0;i<result.length;i++){
	  polylinePointsArray.push(new BMap.Point(result[i].lng,result[i].lat));
	}
	objPolyline = new BMap.Polyline(polylinePointsArray, {strokeColor:"#4B0082", strokeWeight:3, strokeOpacity:0.8,fillOpacity: 0.6, strokeStyle: 'solid'});
循环遍历数据将数据组装起来,形成折线对象。使用map.addOverlay()添加之地图上,随后可以在地图中增加其他自定义方法这些就不贴代码。

 







  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值