Код, представленный по ссылке, фактически показывает, как добавить слой 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.