如何在Mapbox中基于索引为MultiLineString按属性设置样式？

我正在使用带有properties对象的MultiLineString要素，该对象为MultiLineString中的每个子要素定义了颜色，示例数据如下：

MultiLineString

{
  "type": "FeatureCollection",
  "features": {
    "type":"Feature",
    "properties": {
      "lineProperties":[
        {"color":"#FF6600"},
        {"color":"#6600FF"},
        {"color":"#00FF00"}
      ]
    },
    "geometry": {
      "type": "MultiLineString",
      "coordinates": [
        [],
        [],
        []
      ]
    }
  }
}

在地图渲染时，我希望根据coordinates的索引对应lineProperties数组中的颜色，例如第一个coordinates子线应用#FF6600。请问能否使用Mapbox表达式实现基于索引的匹配？

完全可以用Mapbox表达式实现这个需求，核心是利用line-index表达式获取MultiLineString中每条子线的索引，再通过这个索引从lineProperties数组中提取对应的颜色值。

具体实现代码如下：

{
  "id": "multiline-custom-color-layer",
  "type": "line",
  "source": "your-source-id",
  "paint": {
    "line-color": [
      "get",
      "color",
      ["at", ["line-index"], ["get", "lineProperties"]]
    ],
    "line-width": 2
  }
}

关键逻辑解释 #

• ["line-index"]：返回当前渲染的子线在MultiLineString中的索引（从0开始，和coordinates数组的索引完全对应）
• ["at", ["line-index"], ["get", "lineProperties"]]：根据索引从lineProperties数组中取出对应的颜色配置对象
• ["get", "color", ...]：从取出的对象中提取颜色字符串，作为当前子线的渲染颜色

这样就能精准实现每条子线匹配lineProperties中同索引的颜色。

内容的提问来源于stack exchange，提问作者Brett DeWoody