Style is not done loading: Mapbox GL JS

Question

My goal is to create a before and after map that shows a series of coordinate markers on the after map.

When the code is executed, I see this error message in the c

Answer 1

The problem is that you are adding the layer to the map before the map is loaded. Be sure you are attaching the tile source and the style layer in the load event handler.

afterMap.on('load', function() {
  afterMap.addSource("points", {
    "type": "geojson",
    "data": nyGeo
  })
  afterMap.addLayer({
    "id": "points",
    "type": "symbol",
    "source": "points",
    "layout": {
      "icon-image": "{icon}-15",
      "text-field": "{title}",
      "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
      "text-offset": [0, 0.6],
      "text-anchor": "top"
    }
  });
});