您现在的位置: 首页 > SDK开发 > 开发指南

线标注绘制

第一步:确定坐标点（以下代码都要在地图加载完成后调用map.on('loadComplete'）

map.on('loadComplete',function(){
	var center = map.center;  //取地图的中心墨卡托坐标
	
	//定义两个点
	var v1 = {
	x: center.x + 20,   
	y: center.y + 20,
	fnum: 1,           //楼层
	offset: 10          //偏移量
	}
	var v2 = {
	x: center.x - 10,
	y: center.y - 10,
	fnum: 1,
	offset: 10
	}
})

第二步:创建线标注对象

map.on('loadComplete',function(){
	//点集合
	var points = [v1, v2];
	
	//配置线标注样式
	var lineStyle = {
	lineWidth: 6,
	alpha: 0.8,
	offsetHeight: 0,
	lineType: esmap.ESLineType.FULL
	}
	
	//创建线标注对象
	var linemark = new esmap.ESLineMarker(1, points, lineStyle)
	
	//如果要让线标注支持点击，并在点击时返回一定的信息，请绑定datas对象
	linemark.datas = {
	name: 'myMarker'
	}
})

第三步:画线

//调用地图的画线方法
map.drawLineMark(linemark);

删除线标注

您可以根据ID删除某一个线标注:

map.clearLineMarkById(1)

也可以直接删除地图所有的线

map.clearAllLineMark()

线类型定义

//实线
var lineStyle1 = {
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 0,
    lineType: esmap.ESLineType.FULL
}
//普通箭头线
var lineStyle2 = {
    color: "#00ff00",
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 0,
    lineType: esmap.ESLineType.ARROW
}
//自定义虚线(调整gap/size)
var lineStyle3 = {
    color: "#FF0000",
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 0,
    lineType: esmap.ESLineType.DOT_DASH,
    dash: {
        size: 2,
        gap: 1
    }
    // ,noAnimate:true
}
//特殊虚线1
var lineStyle4 = {
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 0,
    lineType: esmap.ESLineType.DOUBLE_DOT_DASH
}
//特殊虚线2
var lineStyle5 = {
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 0,
    lineType: esmap.ESLineType.TRI_DOT_DASH
}
//导航线
var lineStyle6 = {
    color: "#33cc61",
    lineWidth: 6,
    alpha: 0.8,
    offsetHeight: 1,
    lineType: esmap.ESLineType.ESARROW,
    noAnimate: false  //控制箭头动画
}