Estoy usando MapBox en una de mis aplicaciones web, y mi objetivo es mostrar un mapa básico en la página.
Tengo el siguiente guión:
<script> mapboxgl.accessToken = mapToken; const map = new mapboxgl.Map({ container: 'map', // container ID style: 'mapbox://styles/mapbox/streets-v11', // style URL center: [-74.5, 40], // starting position [lng, lat] zoom: 9 // starting zoom }); </script>y para mostrar el mapa, uso:
<div id='map' style='width: 400px; height: 300px;'></div>El problema es que cuando trato de cargar la página, no pasa nada y me sale el siguiente error: Error de referencia no detectado: mapboxgl no está definido
Solucioné el problema simplemente incluyendo esto:
<script src='https://api.mapbox.com/mapbox-gl-js/v2.6.0/mapbox-gl.js'></script> <link href='https://api.mapbox.com/mapbox-gl-js/v2.6.0/mapbox-gl.css' rel='stylesheet' />en el encabezado del archivo HTML.