Deck.GL 使用 CARTO 和 React

Deck.GL with CARTO and React

我正在尝试在 React 应用程序中使用 CARTO 底图 (@deck.gl/carto) 和 Deck.GL (@deck.gl/react)。为了渲染地图图层,文档使用了来自 react-map-gl.

的 Mapbox 的 <StaticMap/> 组件

但是,当我将 CARTO 的免费底图 BASEMAP.VOYAGER 作为 属性 传递给 <StaticMap 组件时,它拒绝显示地图,因为我没有 Mapbox 访问令牌.

所以,我注册并获得了一个 Mapbox 令牌,它工作正常,如下所示:

      <DeckGL
        style={{
          position: "relative",
          width: "100%",
          height: "600px",
        }}
        initialViewState={initViewState}
        controller={true}
        layers={layers}
        onClick={(evt) => console.log(JSON.stringify(evt.coordinate))}
        getTooltip={({ object }) =>
          object &&
          object.coordinates && {
            text: `Longitude: ${object.coordinates[0]}\nLatitude: ${object.coordinates[1]}\nCost: ${object.cost}`,
          }
        }
      >
        <StaticMap
          mapStyle={BASEMAP.DARK_MATTER}
          mapboxApiAccessToken={process.env.NEXT_PUBLIC_MAPBOX_TOKEN}
        />
      </DeckGL>

但我想在不使用 Mapbox 的情况下使用 CARTO 底图。这可能吗?似乎我可以获得 CARTO 底图的唯一方法是通过他们网站上的 Map Builder 工具构建地图,发布它,然后使用从中生成的 link 来使用它。但是我无法创建底图,直到我 link 数据集到地图(即 .csv、URL、数据库、arcGIS 等)。现在,我什么都没有。

所以我很困惑如何在不使用 Mapbox 的情况下实际访问和使用 CARTO 底图。非常感谢任何提示或建议!

解决方法是安装 5.3.11 版本,因此您的应用不需要 Mapbox 令牌,that's due to internal use of Mapbox v2.0

yarn add react-map-gl@5.3.11