Mapbox GL JS填充模式和数据驱动样式



请参见底部的编辑

我正在尝试使用mapbox-js创建一个具有条纹填充模式的地图,类似于这张图。我的数据由多个具有各种属性的多边形组成。我希望某些多边形具有不同的模式,基于一个名为"currentSchool"的特性。我已经能够使用mapbox的填充颜色属性来做非常类似的事情,但由于我需要这些东西被条纹化,我不得不使用填充图案属性,这给我带来了一些麻烦。

当我使用下面的代码片段时,一切都很好,地图只显示具有相同条纹图案的每个多边形。

map.setPaintProperty("blocks", 'fill-pattern', ["case", 
["==", ['number', 300],
300],
"pattern",
"pattern2"]);

在下面的片段中,对于"currentSchool"属性等于300的多边形,我希望它们的填充图案为"pattern"。对于所有其他多边形,我想要它们的填充模式为pattern2。

map.setPaintProperty("blocks", 'fill-pattern', ["case", 
["==", ['number', ["get", "currentSchool"]],
300],
"pattern",
"pattern2"]);

然而,它给了我以下错误消息:

Error: "layers.blocks.paint.fill-pattern: data expressions not supported"

很明显,"得到"这个词给我带来了麻烦,尽管我不知道为什么。我发现了两个使用填充模式和"get"表达式的例子(这里和这里(,所以我认为我所做的应该有效。

mapbox JS文档在"数据表达式"标题下写道:

但是,某些绘制和布局属性还不支持数据表达式。支持级别由每个属性的"SDK支持"表的"数据驱动样式"行指示。只有在绘制特性上才允许使用具有特征状态操作符的数据表达式。

这里(在"填充模式"标题下(是它所指的表。该表表示填充模式确实支持数据驱动的样式,所以我不确定为什么会出现此错误。

我在网上做了很多搜索,并试图链接到相关信息。

有人知道我怎样才能纠正这个错误吗?或者,如果真的不可能将这种数据驱动的样式与mapbox的填充图案一起使用,有人知道我如何实现用条纹图案填充多边形的地图吗(类似于上面链接的图像(?非常感谢。

编辑:

好吧,我真的很笨。我发现出了什么问题。事实证明,我只是在使用一个旧的mapbox版本,它不支持数据驱动的样式。我不久前开始了这个项目,放弃了它,然后又重新开始。我只是以为我使用的是最新的版本。

对于可能遇到类似错误的人来说,Mapbox Expression参考是确定支持每种表达式类型的Mapbox SDK版本的有用资源。这里列出了每个表达式,以及一个表,详细说明了Mapbox GL JS、Android SDK、iOS SDK和macOS SDK支持的SDK版本。

很高兴听到你能够自己解决这个错误,希望这个表达式引用对以后的类似问题有用!

最新更新