问题标签 [mapbox-gl-js]

我在网站上有 mapbox 地图，我可以使用地图的默认按钮进行缩放并在地图中单击，但我需要启用使用鼠标滚轮进行缩放。

任何想法，谢谢。

我正在使用 MapBox GL JS 创建地图。我在 index.html 页面上创建了一个地图，效果很好，但现在我试图在单独的页面上创建另一个地图，并且在引用地图应该去的 div 时，我收到一个错误：

未捕获的类型错误：无法读取 null 的属性“classList”。

我不确定为什么会发生这种情况，因为我在 html 中创建了元素，并且我的 javascript 与在 index.html 页面上成功创建第一个地图的 javascript 相同（但在不同的 div 上）。我在 Node.js 中执行此操作，并将 webpack 捆绑到 main.min.js 文件中，我在 index.html 和第二个 html 页面上都引用了该文件。

我正在尝试使用 MapBox JS 创建具有以下 3 个主要功能的自定义地图：

1. 自定义标记图像（图标）
2. 飞到位置（缓慢或一般的一个）
3. 过滤标记

似乎功能 1 和 2 不属于相同的 JS 文件。就像他们使用不同版本的 JS 文件一样。请参阅下面的链接以获取参考。

有没有人尝试过 Mapbox 并将这两种不同的功能合二为一？

我也使用了 noConflict 但它不起作用！我尝试使用 v0.18.0 版本的 JS 和 CSS 文件创建自定义标记，但在另一个版本 (v2.4.0) 中似乎没有像这样的图标。

以下是两个使用不同版本文件的功能示例。

https://www.mapbox.com/mapbox-gl-js/example/flyto/

https://www.mapbox.com/mapbox.js/example/v1.0.0/custom-marker/

我找到的 JS 和 CSS 版本文件：

这是针对功能 2 和 3

这适用于功能 1 - 自定义标记。

我有一个使用 Mapbox js 在地图上添加标记的 rails 应用程序。它与 Mapbox JS 完美配合。但是，我无法弄清楚如何让它与 Mapbox GL JS 一起使用。这是我的控制器索引操作：

在我看来，我使用此脚本通过 Mapbox JS 获取地图上的点：

我的问题是：如何使用 Mapbox GL JS 完成此任务？这是我用来在页面上获取地图的代码。

我已经尝试了很多不同的方法来传递我的“数据”的 url，就像它在 Mapbox GL JS 文档中所说的那样。例如，我试过

我在控制台中收到此错误：

当我转到 maps/index.json 时，页面上 json 的输出如下所示：

我正在使用具有点的 Mapbox 地图。我想知道添加标记符号的正确程序。这是我的 GeoJSON：

这是 Mapbox 文档中的一个示例：

当我使用这个

我得到小棕点而不是经典标记。我在用

我正在使用

我的整个脚本如下所示：

我错过了什么吗？此外，弹出窗口不会在点上方弹出，它们会在图标上方弹出。你不能用这个棕色的小点来判断，但是以火箭为例，弹出窗口位于火箭的中间。谢谢！

这是一个截图

我正在尝试将 Mapbox ( https://github.com/mapbox/react-native-mapbox-gl ) 与 React-Native、React Redux 和 Flux Navigation 一起使用。

我将我的应用程序构建在一个模块中，其中我有一个模块搜索和映射。它的结构是这样的：

在 SearchResults.js 中，我得到 10 个结果，这些结果与图像和文本一起显示。结果存储在我的 redux 存储中。我在 Map.js 和 SearchResults.js 中有 2 个按钮，它们可以在 2 个容器之间进行导航（通过 Flux 导航 Action.Map() 和 Action.SearchResults() 向前和向后）。

在 Map.js 中，我正在更新地图状态以从 searchResult 存储中接收经度和纬度。我现在面临的问题是，如果我在 SearchResults 和 Map 之间向前和向后切换，就会出现巨大的性能问题。发生这种情况是因为地图总是被重新渲染。

我试图找到使用反应生命周期方法的解决方法，但这没有帮助。我认为这没用，因为我在 2 个模块之间导航。

防止 Map.js 一直重新渲染的最佳方法是什么？

我正在将地图从使用mapbox.js转换为mapbox-gl.js，并且无法绘制一个使用英里或米作为其半径而不是像素的圆。这个特定的圆圈用于显示距中心点在任何方向上的距离区域。

以前我可以使用以下内容，然后将其添加到图层组中：

我在 Mapbox GL 中发现的唯一文档如下：

但这会以像素为单位渲染圆，它不会随缩放而缩放。Mapbox GL 目前是否有一种方法可以根据距离和缩放比例来渲染一个带有圆形（或多个）的图层？

我目前正在使用 Mapbox GL 的 v0.19.0。

我刚开始看 mapbox，我马上就遇到了问题。

我在这里复制了样本； https://www.mapbox.com/mapbox.js/example/v1.0.0/

请注意这部分；

未经编辑，它可以在我的网页中使用。如果我将 accessToken 更改为我的，它就可以工作。但是，如果我将 mapID 从“mapbox.streets”更改为“myusername.mapID”（我已经仔细检查了这些，它们是正确的），我得到的只是一张空地图。

知道我做错了什么吗？

我试图让 webpack 和mapbox-gl在 Meteor 系统中一起工作。我到处查看上面提到的错误，但没有一个有效。这是我的 webpack 设置

供您参考，我使用Reactive Stack提供的 webpack ，它设置 webpack 的方式略有不同。

这是我package.json的 npm 设置

我做错了什么？感谢MDG的某个人可以解释该错误，因为我相信它与 Meteor 系统有关。仅供参考，我npm start用来运行页面

更新

根据@also 的建议，我将部分设置移至webpack.conf.js

我从这里得到设置。和我的webpack.json

但我仍然遇到另一个错误

我正在学习如何使用 mapboxgl，并且正在查看网站上的示例，但找不到有关如何在不显示地图的情况下创建地图的示例。有没有办法做到这一点？显示它的示例是：

但是，我只想先创建地图，但在以后想使用它之前还没有实际显示它。当我在创建 mapboxgl 对象时取出“容器”字段时，api 给了我一个错误，因为它试图在我的 html 页面中查找容器（尽管它不存在，因为我不想显示它）：