OpenLayers 5: ol-mapbox-style + VectorLayer - PullRequest
Новая
       49

OpenLayers 5: ol-mapbox-style + VectorLayer

0 голосов
/ 25 февраля 2019

Я настроил стиль в MapTiler Cloud, и полученный файл style.json необходимо применить к карте Openlayers с помощью плагина ol-mapbox-style .
.Пример предоставлен Maptiler 

<!DOCTYPE html>
<html>
<head>
  <title>TileHosting</title>
  <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch,Promise"></script>
  <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.1.3/build/ol.js"></script>
  <script src="https://cdn.rawgit.com/boundlessgeo/ol-mapbox-style/v3.0.1/dist/olms.js"></script>
  <link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.1.3/css/ol.css">
  <style>
    #map {position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
  </style>
</head>
<body>
  <div id="map"></div>
  <p><a href="https://www.maptiler.com/copyright/" target="_blank">© MapTiler</a> <a href="https://www.openstreetmap.org/copyright" target="_blank">© OpenStreetMap contributors</a></p>
  <script>
    var styleJson = 'https://maps.tilehosting.com/c/xxxxx/styles/voyager/style.json?key=xxxxx';
    var map = new ol.Map({
      target: 'map',
      view: new ol.View({
        center: ol.proj.fromLonLat([-87.53906, -43.83453]),
        zoom: 0
      })
    });
    olms.apply(map, styleJson);
  </script>
</body>

И все работает, стиль визуализируется.
Но тогда я больше не могу добавлять на него векторные слои .
Илилучше, чтобы инструкция «map.addLayer» выполнялась без ошибок, но поверх стиля не отображался слой.
Если я использую обычный TileLayer в качестве фона (не используя плагин ol-mapbox-style), VectorСлои поверх него корректно показывали
Есть идеи почему?

Спасибо, Лука

Ответы [ 2 ]

0 голосов
/ 04 марта 2019

Спасибо Робу за помощь, но я решил просто создать новый проект с нуля.Хотя у меня не было видимых ошибок, я думаю, что это был некоторый конфликт или совпадение между импортом в моем js-коде и элементом «script src» в index.html.Моя неопытность не помогла.Спасибо

0 голосов
/ 26 февраля 2019

(недостаточно репутации, чтобы оставлять комментарии)

Действительно ли слой находится на карте (вы видите его с map.getLayers())?

Если он есть, это может быть просто ниже слоя mapbox, поэтому установка более высокого значения zIndex в вашем векторном слое может сработать.Какую версию ol-mapbox-style вы используете?Я полагаю, что в последней публикации было обновлено значение z-Index по умолчанию.

Если вы хотите, чтобы ваш векторный слой был выше всех других слоев, вы также можете использовать метод layer.setMap(map) вместоmap.addLayer(layer)

...