'Nothing showing when plotting vector tile layer from Arcgis server on MapBox GL JS map

I'm trying to plot a supplied vector tile layer onto a map using MapBox GL JS. I've followed the documentation here but nothing apart from the basic map is being output and there are no console errors. In the browser's Network tab I can see lots of .pbf requests being returned with data so it would seem that the endpoint is passing data back, but I don't know how to determine what the problem is in plotting that data onto the map.

The code is as follows:

mapboxgl.accessToken = '[my access token]';
      const map = new mapboxgl.Map({
        container: 'map',
        style: 'mapbox://styles/mapbox/light-v10',
        zoom: 6,
        center: [-0.118092, 51.509865]
      });

      map.once("load", () => {
        map.addSource("ncn", {
          type: "vector",
          tiles: [
            "https://tiles.arcgis.com/tiles/1ZHcUS1lwPTg4ms0/arcgis/rest/services/NCN_Vector_Tile_Package/VectorTileServer/tile/{z}/{y}/{x}.pbf"
          ]
        });

        map.addLayer({
          id: "ncn-lines",
          type: "line",
          source: "ncn",
          "source-layer": "NCN_Vector_Tile_Package",
          "layout": {
            "visibility": "visible"
          },
          'paint': {
            'line-color': 'rgb(255, 0, 0)'
          }
        });
      });

I am fairly sure that the type should be line (rather than fill) as the data is supposed to contain route lines rather than vector shapes.

I don't have access to the Arcgis server so can't see how anything is configured at that side. Can anyone suggest what might be wrong here and/or how to debug?

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Nothing showing when plotting vector tile layer from Arcgis server on MapBox GL JS map

Sources

Related Questions