javascript - MapBox 中的 Source、Layer 和 Tileset 有什么区别？

Question

我目前正在查看一段代码，它使用 MapBox GL JS 并有一个 addSource() 函数，看起来像这样

this.mapAdapter.map.addSource(`${this.asset.uuid}-data`, {
        type: 'geojson',
        data: this.getMapboxGeometry(),
      })

还有另一个看起来像这样的 addLayer() 函数

this.mapAdapter.map.addLayer({
        id: `${this.asset.uuid}-polygon`,
        type: 'fill',
        source: `${this.asset.uuid}-data`,
        filter: ['==', '$type', 'Polygon'],
        }

我想知道源和层之间的区别是什么。我似乎找不到合适的明确定义。
特征采集代码如下

 type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      properties: {},
      geometry: {
        type: 'Polygon',
      ...}

图层是否以某种方式与特征集合相关？
瓦片集是源的另一个名称还是完全不同？

Answer 1

I want to know what the difference between source and layer is. I can't seem to find a proper clear definition fo it.

当我开始学习 Mapbox 时，我在试图理解源、图层、日期集、图 block 集、样式等之间的差异方面遇到了非常相似的困难。 Mapbox 提供了多少以及他们拥有多少文档真是太棒了，但很容易迷失在噪音中。
我想到了来源 作为我的 map 和 的迷你数据存储层 作为源的视觉表示。添加源会告诉 Mapbox “嘿，这是一个数据存储，其中包含或更多可以添加到 map 的图层”。当您将图层添加到 map 时，您将其指向源并告诉 Mapbox 如何在 map 上表示源。
将源添加到 map 后，您可以使用它创建任意数量的图层。例如，如果我添加了一个包含城市公园的源，我可以从该单一源创建以下三层。

一个 fill将公园边界表示为阴影多边形的图层

一个 line将边界表示为轮廓的层

一个 symbol将公园名称显示为文本标签的图层

我写了一个 Mapbox 和 React Deep Dives 系列，更深入地介绍了这一点。这里有一些与您的问题非常相关的帖子。

A Complete Guide to Sources and Layers in React and Mapbox GL JS

Tilesets & Datasets: Managing Data in Mapbox Studio

The Mapbox Developer's Handbook