时间戳

首页 > 解决方案 > 在 MapBox 中挤压土地

mapbox - 在 MapBox 中挤压土地

问题描述

我想强调一个事实，即在我的地图中土地高于水，因此想在土地图层中添加一个挤压。我认为https://docs.mapbox.com/mapbox-gl-js/example/3d-buildings/使用建筑物并将图层源更改为“土地”会起作用，但事实并非如此。这是特定于构建层的东西还是我做错了什么？这是我的样式 JSON 中的层定义：

    {
        "id": "3d-land",
        "source": "composite",
        "source-layer": "land", # Changed this from building
        "filter": ["==", "extrude", "true"],
        "type": "fill-extrusion",
        "minzoom": 0,
        "paint": {
            "fill-extrusion-color": "#000",
            "fill-extrusion-height":  [
                "interpolate", ["linear"], ["zoom"],
                15, 0,
                18.0, 30.0
            ],
            "fill-extrusion-base": [
                "interpolate", ["linear"], ["zoom"],
                15, 0,
                18.0, ["get", "min_height"]
            ],
            "fill-extrusion-opacity": 0.8
        }
    }

标签： mapbox

解决方案

第一个原因正如控制台所说，"land" does not exist on source "composite". "land"layer 是background样式中单独存在的图层。您不能fill-extrusion用于background图层。您可能想要使用使用"compose"源的图层。

另一个原因来自filter。"filter": ["==", "extrude", "true"]表示如果 layer 的属性名为"extrude"is ，则进行过滤"true"。landlayer 没有属性extrude，所以它总是false.

因此，修复的结果将如下所示：

map.addLayer(
  {
    id: "3d-landcover",
    source: "composite",
    "source-layer": "landcover",
    "type": "fill-extrusion",
    "minzoom": 0,
    "paint": {
      "fill-extrusion-color": "#000",
      "fill-extrusion-height":  [
        "interpolate", ["linear"], ["zoom"],
        15, 0,
        18.0, 30.0
      ],
      "fill-extrusion-base": [
        "interpolate", ["linear"], ["zoom"],
        15, 0,
        18.0, ["get", "min_height"]
      ],
      "fill-extrusion-opacity": 0.8
    }
  }
);

作为第一个原因，如果要使土地高于水，则应按上述添加除水以外的所有层。这不是很有效。

推荐阅读