设置MapBox组件的样式格式 [英] Formatting the style of Mapbox component

问题描述

我目前使用Reaction作为前端，使用ReactMapGL作为我的地图组件，并且我正在尝试设置样式，以便我的所有大陆都有不同的颜色。我尝试了所有提供的不同模板的样式，但我只能在http://studio.mapbox.com中更改水和陆地的颜色。是否可以进行此更改？

推荐答案

您必须在地图上叠加一个大陆图层，然后根据您自己的颜色/大陆映射逻辑对其进行有条件的样式设置。

您可以通过搜索获取大陆图层的数据(Geojson)。

  const continentLayer = {
    id: "continents",
    type: "fill",
    source: {
      type: "geojson",
      data: continents
    },
    paint: {
      "fill-color": [
        "match",
        ["get", "CONTINENT"],
        "Asia",
        "red",
        "Europe",
        "Green",
        /* default */ "yellow"
      ]
    }
  };

  <Layer {...continentLayer} />

这里有一个带工作示例的codesandbox：https://codesandbox.io/s/color-xd1cw?file=/src/App.js(另请看Continental.json)

这篇关于设置MapBox组件的样式格式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！