如何让 Kepler GL 将本地 MBTiles 服务器用于基本地图而不是在线地图？答案

【问题标题】：How do I make Kepler GL use a local MBTiles Server for base maps instead of online maps?如何让 Kepler GL 将本地 MBTiles 服务器用于基本地图而不是在线地图？
【发布时间】：2019-08-01 19:16:24
【问题描述】：

我有一个 MBTile 服务器在我的本地计算机上运行，作为离线 Web 应用程序的服务。我们使用它在离线环境中提供基本地图。我正在探索扩大 Web 应用的范围以包含 Kepler GL 功能。

需要更改或添加哪些文件和代码以引导 Kepler GL 使用我在 localhost:3000 上的切片服务器？

谢谢

尝试替换 mapbox 的令牌键和地图 URL。

defaults-settings.js

... export const MAP_URI = 'demo/map?mapUrl='; ...

webpack.config.js

... // 可选：允许从环境变量中读取 mapbox 和 dropbox 客户端令牌插件：[ //new webpack.EnvironmentPlugin(['MapboxAccessToken', 'DropboxClientId']) new webpack.EnvironmentPlugin({'MapboxAccessToken': 'pk.XXX', 'DropboxClientId': null}) ] }; ...

将 MAP_URI 替换为切片服务器 (http://localhost:3000) 的路径仍将通过编译器并且 kepler 将运行，但没有任何映射。

【问题讨论】：

标签： mbtiles kepler.gl

【解决方案1】：

您需要通过 url 或静态对象加载您的样式，其中包含指向本地图块服务器的源。然后调用 loadCustomMapStyle 加载，addCustomMapStyle 立即使用。

const wrapIt = wrapTo("map");
dispatch(
  wrapIt(
    loadCustomMapStyle({
      style: styleObject
    })
  )
);
dispatch(wrapIt(addCustomMapStyle()));

【讨论】：