1

我在 mapbox studio 中创建了一些自定义样式。它们本质上只是 mapbox 户外风格和 mabpox 卫星风格，每个都是自定义的，每个都分成 2 种风格：根本没有标签的底图，只有没有底图的标签。我想让用户能够打开和关闭图层，或设置透明度。您可以在此处查看图层：

仅限户外标签

仅卫星标签

在 mapbox studio 中，瓷砖在没有道路/标签/等的地方显示透明度。这是我所期望的。然后我在传单中使用这些图层，如下所示：

var mapBoxOutdoorsLabels = L.tileLayer(
  'https://api.mapbox.com/styles/v1/slutske22/ck87tp2fq0rq41iqox69g4ko5/tiles/256/{z}/{x}/{y}@2x?access_token={accessToken}', 
  { accessToken ,maxZoom: 18, pane: 'labels'})
.addTo(map1)

var mapBoxSatelliteLabels = L.tileLayer(
'https://api.mapbox.com/styles/v1/slutske22/ck8i7fv4h0h771ipc6mwzwmp4/tiles/256/{z}/{x}/{y}@2x?access_token={accessToken}', 
  { accessToken ,maxZoom: 18, pane: 'labels'})
.addTo(map2)

据我所知，我导入这两层的方式是相同的。但是由于某种原因，我的户外标签图层正确显示（具有透明背景），而我的卫星标签图层显示为全黑背景，您无法看到底图。右边的地图就是问题所在：

问题

这是问题的工作代码框

我不确定我在 mapbox studio 或我的传单导入中做错了什么，以便用黑色而不是透明生成瓷砖。我构建这两张地图的方式是相同的，至少据我所知。有任何想法吗？

谢谢阅读。

4

1 回答 1

1

标签 mapbox 样式中的背景图层不透明。

这是一个代码笔，其中包含您的样式副本，背景固定

我做了什么：

从样式的 URL 中删除该/tiles/{x}/{y}/{z}/部分并在浏览器中运行该部分会从 mapbox 中返回 json。在那里我看到你的背景层颜色缺少 alpha 通道值。

"layers": [
        {
            "id": "background",
            "type": "background",
            "layout": {
                "visibility": "none"
            },
            "paint": {
                "background-color": "hsl(222, 56%, 4%)" <= SHOULD BE (222, 56%, 4%, 0)
            },
  • 我能够保存 json 文件并将其作为我自己的样式上传到https://studio.mapbox.com/
  • 在那里我改变了背景的 alpha 通道并降低了卫星层的不透明度。
  • 似乎“可见性：无”没有按预期工作
  • 导出为新样式，我用我的样式和访问令牌更新了分叉
于 2020-12-06T12:38:01.263 回答