Question

我正在尝试在我编写的现有Openlayers 3代码中添加自定义的映射框GL JS底图（由同事设置样式），尽管很难找到使这两个元素协同工作的解决方案。到目前为止，我一直在像下面的示例中一样添加图层，没有问题：

      new ol.layer.Tile({
        title: 'Satellite',
        type: 'base',
        visible: false,
        source: new ol.source.XYZ({ //Mapbox layer with API Key
          url: 'https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/256/{z}/{x}/{y}?access_token=API-KEY-HERE'
        })
      })

但是，当我想添加这样的Mapbox GL JS自定义样式时，它不起作用。

new ol.layer.Tile({
            title: 'CustomStyleMapboxGL',
            type: 'base',
            source: new ol.source.XYZ({
              url: 'https://api.mapbox.com/styles/v1/itatters/cjo09902ya4z92speha95h57d.html?fresh=true&title=true&access_token=API-KEY-HERE#16.0/45.505643/-73.576557/305'
            })
          })
})

如果有任何方法可以使Mapbox GL JS样式的图层与Openlayers 3配合使用（无论是我在ex.2中尝试的方式，还是其他方式），将不胜感激！我尝试对所有代码使用Mapbox API，尽管遇到了麻烦。...

Answer 1

OpenLayers无法开箱即用地解析Mapbox Style对象，但是ol-mapbox-style库增加了对此的支持。使用它非常简单：

from("file:/home/test/from/")
  .setHeader("targetDynamicEndpoint", constant("file:/home/test/to/"))
  .toD("${header.targetDynamicEndpoint}")

在Openlayers 3中加载mapbox GL JS底图样式

1 个答案: