Как я могу добавить векторный слой мозаики Mapbox из Geoserver в Mapbox? - PullRequest
0 голосов
/ 26 марта 2020

Я опубликовал шейп-файл в качестве векторного тайла на GeoServer в соответствии с this . Теперь, как я могу добавить этот слой в Mapbox?

Я был бы очень рад, если бы вы могли мне помочь.

1 Ответ

0 голосов
/ 26 марта 2020

Код, представленный по ссылке, фактически показывает, как добавить слой GeoServer на карту Mapbox. Предполагая, что вы хотите добавить слой на карту с помощью Mapbox GL JS (поскольку ваш пост помечен mapbox-gl-js, ваш код будет выглядеть примерно так:

mapboxgl.accessToken = /* YOUR MAPBOX ACCESS TOKEN HERE */;;
var map = new mapboxgl.Map({
  container: 'map', // container id
  style: 'mapbox://styles/mapbox/streets-v11', // stylesheet location
  center: [-74.5, 40], // starting position [lng, lat]
  zoom: 9 // starting zoom
});

// Add the GeoServer layers as a source to your map.
map.addSource(
  "<source-name>": {
    "type": "vector",
    "tiles": [
      "http://localhost:8080/geoserver/gwc/service/wmts?REQUEST=GetTile&SERVICE=WMTS
        &VERSION=1.0.0&LAYER=<workspace>:<layer>&STYLE=&TILEMATRIX=EPSG:900913:{z}
        &TILEMATRIXSET=EPSG:900913&FORMAT=application/vnd.mapbox-vector-tile
        &TILECOL={x}&TILEROW={y}"
    ],
    "minZoom": 0,
    "maxZoom": 14
  }
);

// Style the GeoServer source in order to display it visually on your map
map.addLayer({
  'id': 'geoserver-layer',
  'type': /* fill in based on options here: https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#type */,
  'source': '<source-name>'
  /* Add any additional properties, full details here: https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#type */
});

Короче говоря, GeoServer ссылка на документацию содержит код для добавления источника к вашей карте, а затем вы должны добавить слой , чтобы визуально стилизовать источник на вашей карте.

Я бы рекомендуем взглянуть на множество Mapbox GL JS примеров , чтобы понять, как можно добавлять, стилизовать, изменять источники и слои и т. д. c.

...