地图滤镜插件

地图滤镜,顾名思义就是美化地图的外观。用户可以根据自己的需求和偏好,自定义设置地图样式。

地图滤镜插件

地图滤镜,顾名思义就是美化地图的外观。用户可以根据自己的需求和偏好,自定义设置地图样式。

地图滤镜插件主要用于GIS场景下,用户可自定义地图配色。

1. 功能说明

地图滤镜插件的主要功能就是调整地图的外观样式。具体功能可参考后续方法,其中有详细的介绍和使用。

2. 构造

在SDK中实例化地图滤镜插件,代码示例如下:

const mapFilterPlugin = new ubm.MapFilterPlugin()

3. 类型

3.1 过滤选项

过滤选项有以下几种:

说明
hue-rotate色彩旋转
contrast对比度
brightness亮度
grayscale灰度
invert图像反色
saturate饱和度
opacity透明度
sepia褐色

3.2 SVG过滤选项

选项
1teal-white
2teal-lightgreen
3sepia
4purple-sepia
5blackCurrant-and-mint
6sea
7warm-sea
8spring-grass
9red-sunset-with-purple
10red-sunset
11gold-sunset
12dark-crimson-sepia
13dark-blue-sepia
14dark-green-sepia
15x-rays
16warm-x-rays
17golden-x-rays
18purple-warm
19green-pink-acid
20yellow-blue-acid
21posterize
22grain

4. 属性

属性类型可选说明
filterstring必填过滤条件

4.1 过滤条件

查看设置的过滤条件,代码示例如下:

const mapFilter = mapFilterPlugin.model.filter

5. 方法

方法说明
cssFilterChange修改样式
updateMapFilter更新svg滤镜
updateMapFilter更新地图滤镜

5.1 修改样式

cssFilterChange(value: number | string, key: string): void

参数value是指修改某个过滤选项的值,取值范围为0-1; 参数key是指修改的某个过滤选项,具体可查看过滤选项

如设置图像反色为0.5,代码示例如下:

mapFilterPlugin.model.cssFilterChange(0.5,"invert")

5.2 更新svg滤镜

svgFilterChange(value: string): void

参数valueSVG过滤选项

如设置svg滤镜为gold-sunset,代码示例如下:

mapFilterPlugin.model.svgFilterChange('gold-sunset')

5.3 更新地图滤镜

updateMapFilter(): void

更新地图滤镜,代码示例如下:

mapFilterPlugin.model.updateMapFilter()

注:不管是修改样式还是更新svg滤镜,最后都要执行更新地图滤镜的操作,否则都不生效。

BIMFlux AI