LineLayer
继承FeatureLayer类,在支持实线、虚线的基础上支持描边线、纹理贴图线、间隔图标填充。
构造函数
| 构造函数 | 描述 |
|---|---|
| BMapGL.LineLayer(options: object) | 继承FeatureLayer类,在基础实线、虚线的基础上支持描边线、纹理贴图线、间隔图标填充 |
配置选项
options属性除FeatureLayer参数外,增加以下参数:
| 属性 | 类型 | 描述 |
|---|---|---|
| style | object | 线图层显示样式配置对象,详见样式配置 |
样式配置
| 属性 | 类型 | 描述 |
|---|---|---|
| sequence | boolean | 是否采用间隔填充纹理,默认false |
| marginLength | number | 间隔距离,默认16,单位像素 |
| borderCovered | boolean | 默认true,会出现描边被线填充覆盖现象。如果设置false不会出现压盖现象,但不允许使用图像纹理模式 |
| borderMask | boolean | 是否受内部填充区域掩膜,默认true,如果存在borderWeight小于0,则自动切换false |
| borderColor | string | StyleExpress | 描边颜色 |
| borderWeight | number | StyleExpress | 描边宽度,可以设置负值 |
| strokeTextureUrl | string | StyleExpress | 填充纹理图片地址,默认是空。图片需要是竖向表达,在填充时会自动横向处理 |
| strokeTextureWidth | number | StyleExpress | 填充纹理图片宽度,需要是2的n次方 |
| strokeTextureHeight | number | StyleExpress | 填充纹理图片长度,需要是2的n次方 |
| strokeLineJoin | string | StyleExpress | 描边线连接处类型,可选'miter', 'round', 'bevel',默认miter |
| strokeLineCap | string | StyleExpress | 描边线端头类型,可选'round', 'butt', 'square',默认round |
| strokeColor | string | StyleExpress | 描边线颜色,默认#dec41b |
| strokeWeight | number | StyleExpress | 描边线宽度,默认0 |
| strokeOpacity | number | StyleExpress | 描边线透明度,默认1 |
| strokeStyle | string | StyleExpress | 描边线类型,可选'solid'、'dashed' 和 'dotted',默认solid |
| dashArray | array | StyleExpress | 描边线虚线设置,默认[8,4]表示实线部分长8像素,间隙部分长4像素 |
| linksLine | boolean | MultiLineString是否以多段线形式组成一条线,可以通过strokeColorControl设置每段的颜色,默认false |
| strokeColorControl | function(line:number, segment:number):string | 输入参数是第几条路线,第几段,输出是颜色字符串 |
| traceDisappear | boolean | 痕迹是否使用消失模式,默认false。false代表使用traceControl设置颜色 |
| traceStart | boolean | 是否从起点开始处理,否则从终点开始处理痕迹。默认true |
| traceControl | function(line:array[number]):array[number] | 痕迹距离设置函数,输入参数是第几条路线数组,输出是距离每条线起点的痕迹长度数组,单位为米 |
| traceColor | array[3] | rgb颜色值,取值范围0-255 |
示例
ts
// 创建线图层
const layer = new BMapGL.LineLayer({
idKey: 'id',
crs: 'BD09LL',
style: {
sequence: false,
marginLength: 16,
borderCovered: true,
borderMask: true,
borderColor: '#000000',
borderWeight: 2,
strokeColor: '#ff0000',
strokeWeight: 2,
strokeOpacity: 0.8,
strokeStyle: 'solid',
dashArray: [8, 4],
strokeLineJoin: 'round',
strokeLineCap: 'round'
}
});
// 设置数据
layer.setData(geojsonData);
// 添加到地图
map.addLayer(layer);注意事项
样式设置:
- 合理设置描边和填充样式
- 注意纹理图片的尺寸要求
- 控制线条宽度和透明度
纹理控制:
- 纹理图片需要是竖向表达
- 图片尺寸需要是2的n次方
- 注意纹理填充的性能
痕迹效果:
- 合理设置痕迹消失模式
- 注意距离计算单位
- 控制颜色值范围
