Add 3D terrain to a map

Use setTerrain to add 3D terrain to a map using a raster terrain source. See the example: https://docs.mapbox.com//mapbox-gl-js/example/add-terrain/

by Amatewasu

HTML

<script src="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.js"></script>
<link rel="stylesheet" href="https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.css">
<script src="https://unpkg.com/@turf/[email protected]/turf.min.js"></script>

<div id="map"></div>
<video controls style="opacity: 0.2;"></video>

CSS

body { margin: 0; padding: 0; }
#map { position: absolute; top: 0; bottom: 0; width: 100%; }

JavaScript

mapboxgl.accessToken = 'pk.eyJ1IjoiYW1hdGV3YXN1IiwiYSI6ImNrYXV2ZTlqYTB6YjQyeWwyYXZvZTZ3cWYifQ.WCLjyDZ7Bn9bLM1E2BzQcw';
    var map = new mapboxgl.Map({
        container: 'map',
        zoom: 6,
        center: [3.0708797,45.8265264],
        pitch: 10,
        bearing: 0,
        //style: 'mapbox://styles/mapbox-map-design/ckhqrf2tz0dt119ny6azh975y'
        style: 'mapbox://styles/mapbox-map-design/ckhqrbxlc1awj19svtb92m0bd'
    });
    
    var coordinates =...