三维可视化场景绘制管线-管线标注 对于管道、电线、水管、城市管廊、石油管线等进行在三维场景上进行展示管理。

第一步：设置管线的style（以下代码都要在 map.on('loadComplete') 中调用）

var style = {
    lineWidth: 3,              // 管线宽度
    lineWidthMeter: true,      // lineWidth是否代表真实(单位/m)
    offsetHeight: 1,           // 向上偏移量(距离地面高度)
    lineMode: 'circle',        // 贴图线模型样式(可选项参考以下表格)
    lineType: esmap.ESLineType.TEXTURE, //线样式
    url: './image/tube0.png',  // 指定管线贴图
    reverseAnimate: false,     // 是否反转流向
    noAnimate: false,          // 是否禁用流动动画
};

贴图线额外参数说明

注意:以下属性lineType必须设置为esmap.ESLineType.TEXTURE才可生效

参数	说明	类型	可选值	默认值	是否必填
lineWidth	管道线宽度	Number || String	——	——	是
lineWidthMeter	管道线宽度是否代表真实	Boolean	——	——	否
offsetHeight	管道线标注整体向上偏移量	Number	——	——	否
url	贴图线的图片地址	String	——	——	否
lineMode	贴图线模型样式	String	PLANE(平面)CIRCLE(管道)	esmap.ESLineMode.PLANE	否
arrow	是否显示箭头	Boolean	——	false	否
metalness	金属度	Number || String	0-1	——	否
reverseAnimate	是否反转贴图流动方向	Boolean	——	false	否
closed	是否自动连接起点终点	Boolean	——	false	否
animateSpeed	贴图流动速度	Number || String	——	——	否
arrow	是否绘制箭头	Boolean	——	false	否
transparent	开启透明度	Boolean	——	false	否

Tip: 其他基础配置参考 绘制线标注 页面

第二步：设置管线的点集坐标

var points = [];
points.push({
    x: map.center.x,
    y: map.center.y,
    offset: 5,
    fnum: 1
});
points.push({
    x: map.center.x,
    y: map.center.y + 5,
    offset: 10,
    fnum: 1
})
points.push({
    x: map.center.x,
    y: map.center.y + 10,
    offset: 10,
    fnum: 1
})

第三步：创建线标注对象，调用map线标注接口进行绘制

var lineMarker = new esmap.ESLineMarker({
    id: 1,       // 线id
    points: points,         // 点集合
    style: style    // 线样式
});
map.drawLineMark(lineMarker);

标注支持手动控制显隐:

linemark.visible = false  // 隐藏标注
linemark.visible = true   // 显示标注