时间戳

首页 > 解决方案 > 如何让 Kepler GL 将本地 MBTiles 服务器用于基本地图而不是在线地图？

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

问题描述

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

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

谢谢

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

默认设置.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 ) 的路径仍将通过编译器，并且开普勒将运行，但没有任何地图。

标签： mbtileskepler.gl

解决方案

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

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

推荐阅读