I am trying to use some US Census Bureau vector tiles hosted on ArcGIS online (https://gis.data.census.gov/arcgis/rest/services/Hosted/VT_2010_140_00_PY_D1/VectorTileServer) with Mapbox GL JS.

It doesn't seem like all the tiles to cover the map extent are being loaded. Is there an option I need to pass? I'm not sure if this is a Mapbox or ArcGIS Vector Tile Service issue.

Screenshot 1 - I've outlined the "empty" spaces in red

Screenshot 2 - See how the red area from Screenshot 1 loads when I move the map east

mapboxgl.accessToken = MY_TOKEN;
  const map = new mapboxgl.Map({
  container: 'mapid', // container ID
  style: 'mapbox://styles/mapbox/light-v10', // style URL
  projection: 'albers',
  center: [-97, 39], // starting position
  minZoom: 6,
  zoom: 6 // starting zoom
});

map.on('load', () => {

  map.addSource("ct2010", {
    type: "vector",
    tiles: ["https://gis.data.census.gov/arcgis/rest/services/Hosted/VT_2010_140_00_PY_D1/VectorTileServer/tile/{z}/{y}/{x}.pbf"],
    minzoom: 6,
    promoteId: "GEOID" // promote field to be used as a foreign key
  })
  
  // Add a new layer to visualize the polygon.
  map.addLayer({
    'id': 'cdfi',
    'type': 'fill',
    'source': 'ct2010', // reference the data source
    "source-layer": "CensusTract",
    'layout': { },
    'paint': {
      'fill-color': 'rgb(13,40,75)',
      'fill-opacity': 0.5
    }
  });
  
});

EDIT: I think my problem was trying to use the Albers projection. Removing that option resolves my issue. Maybe related to https://github.com/mapbox/mapbox-gl-js/issues/11284