首页 文章

Mapbox GL JS与Mapbox.js

提问于
浏览 次
46

从Mapbox词汇表中，Mapbox.js

Mapbox.js是一个JavaScript库，允许您将交互式 Map 添加到您的网站 . 它是Leaflet的一个插件，它是一个可以免费使用的开源库 .

和Mapbox GL JS

Mapbox GL JS是一个使用Mapbox GL渲染交互式 Map 的JavaScript库 . 它是一个可以免费使用的开源库 . 您可以将Mapbox Studio创建的Mapbox样式或自定义样式添加到Mapbox GL JS应用程序中 .

从this answer

Mapbox样式适用于Mapbox GL以及原生iOS和Android SDK . 您不能将它们与经典的Mapbox JS一起使用 . Mapbox JS支持光栅图块，你无法设置那些样式 . 他们只是图像 . Mapbox GL和原生SDK（可以）使用矢量切片，并且可以设置样式 .

我相信我可以使用 mapbox.js 代替 leaflet css 和 js 来源，但是我可以用 mapbox-gl.js 做同样的事吗？
What other differences exist between the two libraries?

javascript mapbox mapbox-gl-js

4 回答

  • 39

    据我所知，Mapbox GL JS将成为当前使用Leaflet的Mapbox JS的替代品 . Leaflet做了很多事情，GL也可以做得更多 . 但不是一切 . 反之亦然 . GL可以做Leaflet无法做的事情 . GL中最重要的是它使用WebGL围绕矢量切片构建 . 从介绍文章：

    宣布Mapbox GL JS - 一个快速而强大的Web Map 新系统 . Mapbox GL JS是一个客户端渲染器，因此它使用JavaScript和WebGL以视频游戏的速度和流畅度动态绘制数据 . Mapbox GL不是在服务器级别修复样式和缩放级别，而是在JavaScript中提供动力，允许动态样式和自由形式交互 . 矢量 Map 是下一个演变，我们很高兴看到开发人员使用这个框架构建了什么 .

    如果你真的想要两者并排比较，我很遗憾没有据我所知 . 在进行比较时，有太多的事情需要提及/考虑，所以最好根据自己的要求自己做这样的事情 . 一个好的开始是比较每个框架的示例，因为它可以很好地了解两者可以做什么：

    之后你可以比较他们的API：

    要记住的一点是，GL是新品牌，我们的开发人员都知道这是有代价的 . 一些纠结尚未解决 . 至于Leaflet，它非常成熟，使用广泛，经过充分测试/验证 . 如果你想看一下GL目前遇到的问题，你可以在存储库中查看Github上的问题：

    希望有所帮助，祝你好运！

    回复于
  • 21

    iH8的答案很棒，可以添加更多细节：

    对于基本 Map ，Mapbox.js显示栅格切片（PNG和JPEG）文件，并使用HTML和CSS显示它们 . Mapbox GL JS显示矢量切片（花式协议缓冲区）并使用WebGL显示它们 . 它也可以显示光栅图块，但这不是焦点 .

    Mapbox.js和Mapbox GL JS都支持GeoJSON图层和标记等叠加层 . 两者都是开源的，具有类似的许可证和一些共享贡献者 .

    Mapbox.js图层的样式存储在服务器上并使用服务器技术呈现 . Mapbox GL JS的样式在浏览器中动态呈现，因此可以实时更改 .

    Leaflet拥有更广泛的浏览器支持，代价是某些浏览器无法支持的一些内容，例如 Map 倾斜和旋转 . Mapbox GL支持支持WebGL的浏览器，并且在新计算机上表现最佳 . 它有一个名为Mapbox GL Native的原生版本，在所有手机上表现都非常出色 .

    尽管有这些名称，但您可以将Leaflet与Mapbox和Mapbox.js一起使用，将Mapbox GL与非Mapbox样式一起使用 .

    回复于
  • 8

    Generally Leafletjs and Mapbox.js are the same ，但是Mapbox.js有插件和扩展，它们包装Leaflet并与Mapbox的服务绑定（例如方向） . 其他公司或产品也存在类似的插件和功能，Leaflet可以使用它们作为Mapbox的补充或替代 . 基于Leaflet的库通常具有更好的遗留浏览器支持，使用光栅图块等 . 这些功能正在添加，其中包含矢量图块（pbf，mvt等）和各种渲染器（包括webgl）等现代功能 .

    Mapbox-gl-js and the native variant mapbox-gl 是开源库，它们是_551590_到canvas元素中（对于-js变体） . 这是相对较新的，所以有些东西很容易与Leaflet可能是不同的或具有挑战性（截至2016年4月），这表示它们非常相似并且工作得很好， including on mobile devices （从过去的几年，例如iphone 5s） . 随机怪癖的一个例子是以色列的希伯来语标签，从右到左阅读，是向后的，看起来像废话（这是一个未解决的问题） .

    如果删除较旧的浏览器支持，Mapbox-gl（-js）路由可能是一个不错的选择 . 凭借我有限的经验（使用它几个月），它拥有最佳的用户开发人员体验Mapbox的工程/输出一致 . 我对他们付费服务的经验较少，目前还不清楚他们的图书馆与这些服务的紧密联系 . 对于移动项目，我在查看Google Maps，Leaflet v0.7和v1后转移到mapbox-gl-js，这似乎是一个很好的决定 .

    我开始使用Mapbox-gl-js以及之前的Leaflet经验和HTML / CSS / JS的熟练程度，发现the primer和examples都有助于理解技术细节 . 包括如何使用JSON（而不是CSS）设置 Map 样式 . 另外还要仔细研究服务条款，这与谷歌相比是一个重要的积极差异因素 . Mapbox 's services don't在美国以外拥有最强大的覆盖范围，所以一定要给出一些评论（根据我的经验，通常可以使用其他提供商，因此这与Mapbox功能或标准紧密耦合） .

    回复于
  • 12

    我正在努力将复杂的基于Leaflet的 Map 系统切换到Mapbox GL，我会说我发现的一个显着差异在于绘制工具和GeoJSON层的处理 . Leaflet有一套绘图工具，包括非标准的GeoJSON，如标记，矩形和圆形 . Mapbox GL的开发人员决定专注于原生GeoJSON，这意味着没有开箱即用的绘图/渲染圆和矩形支持（例如，没有像Mapbox GL中的L.Circle）;有一个标记，但造型看起来像传统的Leaflet标记需要创建自己的精灵或使用SVG . 所有这些事情仍然是可能的，但是他们在开发人员方面比在Leaflet中做了更多的设置 .

    此外，大多数Mapbox GL图层都呈现为画布元素 . 这意味着，与Leaflet不同，没有与您的各个层相关联的HTML元素 . 如果需要，这使得用CSS定位元素变得更加困难 . 我在这里发现的一个例外是标记，它们被渲染为单独的HTML元素 .

    所有这一切，我已经能够几乎完全复制现有的绘图工具和渲染样式与一些小的差异 . 如果您需要高度自定义的绘图工具，Mapbox GL可能会让您感到沮丧 .

    浏览器支持也被提到是一个潜在的问题 . 任何supports WebGL可以运行Mapbox GL的浏览器 . 这包括所有主流浏览器 . 我们看到的唯一一个不支持Mapbox GL的重要浏览器设置是IE10或更早，但我们的分析表明我们的用户几乎都没有使用这些浏览器，所以我们正式放弃对它们的支持 . 您的里程可能会有很大不同

    总的来说，我对切换感到满意，因为我认为Mapbox GL更易于使用并提供更好的用户体验 .

    回复于

相关问题