AI
产品服务
解决方案
文档与支持
定价
更新时间: 2026/03/12 14:37
LineLayer图层
简介

JSAPI GL提供LineLayer类支持加载GeoJSON线数据源,方便用户进行海量线数据的个性化展示。LineLayer在支持传统实线、虚线的基础上,线图层支持描边线、贴图纹理填充线、间隔图标填充等效果。 LineLayer继承FeatureLayer类,FeatureLayer类继承NormalLayer类,FeatureLayer作为内部类不支持用户实例化,NormalLayer支持用户创建自定义图层。图层可设置基本配置信息、数据源、定义事件等。通过LineLayer类的options,可以通过表达式形式设置图层线样式。

DEMO详情
标准线
贴图线
间隔图标填充
类参考

详见类参考

图层示例
1. 定义图层类
let lineLayer = new BMapGL.LineLayer({
enablePicked: true,
autoSelect: true,
pickWidth: 30,
pickHeight: 30,
selectedColor: 'yellow', // 选中项颜色
style: { // 配置样式
// borderMask: false,
borderColor: 'rgba(27, 142, 236, .6)',
borderWeight: 2,
strokeWeight: 3,
strokeStyle: 'dashed',
strokeColor: ['case', ['boolean', ['feature-state', 'picked'], false], '#6704ff', ['match', ['get', 'name'], 'demo1', '#ce4848', 'demo2', '#6704ff', 'demo3', 'blue', '#6704ff']],
}
});
2. 添加图层事件(可选)
lineLayer.addEventListener('click', function (e) {
if (e.value.dataIndex !== -1 && e.value.dataItem) {
this.updateState(e.value.dataIndex, { picked: true });
}
});
3. 设置GeoJSON数据源
lineLayer.setData(lineGeoJSONData);
4. 添加或移除图层
map.addNormalLayer(lineLayer);
map.removeNormalLayer(lineLayer);

上一篇

定位

下一篇

面图层

本篇文章对您是否有帮助?