Mapabc地图----改变地图上的某个点

最新推荐文章于 2021-05-31 14:59:45 发布

最新推荐文章于 2021-05-31 14:59:45 发布 · 253 阅读

文章标签：

#Mapabc #地图应用

MapAbc 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种调整设备状态时使用的可视化弹窗与标注技术，包括弹窗样式设定、设备信息展示、标注创建与更新等关键步骤。通过详细的操作流程和实例代码，展示了如何实现设备状态调整过程中的用户交互与视觉反馈。

   function changeEquimentStatus(equipmentInfo) {
    	
	    var tip = mapObj.getOverlayById(equipmentInfo.id);
	          tip.option.tipOption.title = "这里是弹出框的标题";//信息窗口标题
			  tip.option.tipOption.content="这里是弹出框的内容";//信息窗口内容
			  tip.option.tipOption.content +="里是弹出框的增加的内容";
			  tip.option.tipOption.borderStyle.thickness = 2;
			  tip.option.tipOption.borderStyle.color =  0x005cb5;
			  tip.option.tipOption.borderStyle.alpha = 1;
			  tip.option.tipOption.titleFontStyle.name = "Arial";
			  tip.option.tipOption.titleFontStyle.size = 12;
			  tip.option.tipOption.titleFontStyle.color =  0xffffff;
			  tip.option.tipOption.titleFontStyle.bold = true;
			  tip.option.tipOption.contentFontStyle.name = "Arial";
			  tip.option.tipOption.contentFontStyle.size = 13;
			  tip.option.tipOption.contentFontStyle.color =  0x000000 ;
			  tip.option.tipOption.contentFontStyle.bold = false;
			  tip.option.tipOption.fillStyle.color =  0xFFFFFF; //填充色
			  tip.option.tipOption.fillStyle.alpha = 1;
			  tip.option.tipOption.titleFillStyle.color = 0x005cb5;
			  tip.option.tipOption.titleFillStyle.alpha = 1;  
		
		  var labelOption = new MLabelOptions();//添加标注
			  labelOption.content = equipmentInfo.name;//标注的内容     <----------------这里是小图标的名字
			  labelOption.hasBorder = true;//设置标注背景是否有边框，默认为false，即没有边框
			  labelOption.hasBackground = true;//设置标注是否有背景，默认为false，即没有背景
			  labelOption.labelPosition = new MPoint(-25,0);//标注左上角相对于图片中下部的锚点。Label左上角与图片中下部重合时，记为像素坐标原点(0,0)。
			
		  //构建一个名为markerOption的点选项对象。
		  var markerOption = new MMarkerOptions();
			  markerOption.imageUrl = "/项目名/images/st"+status+".png";//标注图片或SWF的url，默认为蓝色气球图片
			  markerOption.anchor = new MPoint(0,0);//图片锚点BOTTOM_CENTER相对于标注位置的位置
			  markerOption.imageAlign = BOTTOM_CENTER; //设置图片相对于加点经纬度坐标的位置。九宫格位置。默认BOTTOM_CENTER代表正下方
			  markerOption.labelOption = labelOption;//设置点的标注参数选项
			  markerOption.isEditable = false; //设置点是否为可编辑状态,rue，可以编辑；	false，不可编辑（默认）
			  markerOption.canShowTip = true; //是否在地图中显示信息窗口，true，可以显示（默认）；false，不显示
			  markerOption.rotation = "0"; //设置图标旋转的角度
			  
			  //equipmentInfo.lon <--------(经度) (纬度)--------->equipmentInfo.lat
		  var marker = new MMarker(new MLngLat(equipmentInfo.lon,equipmentInfo.lat),markerOption);//通过经纬度坐标及参数选项确定标注信息
			  marker.id = equipmentInfo.id;//对象编号，也是对象的唯一标识
			　mapObj.updateOverlay(tip);//修改内容和标题
		      mapObj.updateOverlay(marker);//更新对象
		      
		      
    }