diff --git a/avisstage/static/js/recherche.js b/avisstage/static/js/recherche.js
index d466ff5..bc6457f 100644
--- a/avisstage/static/js/recherche.js
+++ b/avisstage/static/js/recherche.js
@@ -83,10 +83,10 @@ function InterfaceRecherche(STATIC_ROOT, API_LIEU, MAPBOX_API_KEY, ITEMS_URL, li
     function initCarte() {
         if (map !== undefined) return;
         map = L.map("carte").panTo([30, 15]).setZoom(1);
-        var layer = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
+        var layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
             attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
             maxZoom: 18,
-            id: 'mapbox.streets',
+            id: 'mapbox/streets-v11',
             accessToken: MAPBOX_API_KEY
         });
         map.addLayer(layer);
diff --git a/avisstage/templates/avisstage/detail/stage.html b/avisstage/templates/avisstage/detail/stage.html
index d5b3c65..9ec7b37 100644
--- a/avisstage/templates/avisstage/detail/stage.html
+++ b/avisstage/templates/avisstage/detail/stage.html
@@ -6,6 +6,9 @@
 {% block extra_head %}
     <script src="{% static 'js/toc.min.js' %}" type="text/javascript"></script>
     <script type="text/javascript" src="{% static "js/leaflet.js" %}"></script>
+    <script src='https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.js'></script>
+    <link href='https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.css' rel='stylesheet' />
+    <script src="https://cdn.maptiler.com/mapbox-gl-leaflet/latest/leaflet-mapbox-gl.js"></script>
     <link rel="stylesheet" type="text/css" href="{% static "css/leaflet.css" %}" />
     <script type="text/javascript" src="{% static "js/tile.stamen.js" %}"></script>
     <script type="text/javascript">
@@ -13,10 +16,10 @@
      var STATIC_ROOT = "{{ STATIC_URL|escapejs }}";
      function initStageMap(lieux) {
          var map = L.map("stage-map");
-         var layer = L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
+         var layer = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
              attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
              maxZoom: 18,
-             id: 'mapbox.streets',
+             id: 'mapbox/streets-v11',
              accessToken: "{{ MAPBOX_API_KEY|escapejs }}"
          });
          map.addLayer(layer);
diff --git a/avisstage/templates/avisstage/recherche/resultats.html b/avisstage/templates/avisstage/recherche/resultats.html
index ba40785..69a894e 100644
--- a/avisstage/templates/avisstage/recherche/resultats.html
+++ b/avisstage/templates/avisstage/recherche/resultats.html
@@ -10,6 +10,9 @@
     <link rel="stylesheet" type="text/css" href="{% static 'css/leaflet.css' %}" />
     <link rel="stylesheet" type="text/css" href="{% static 'css/MarkerCluster.css' %}" />
     <link rel="stylesheet" type="text/css" href="{% static 'css/MarkerCluster.Default.css' %}" />
+    <script src='https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.js'></script>
+    <link href='https://api.mapbox.com/mapbox-gl-js/v2.0.0/mapbox-gl.css' rel='stylesheet' />
+    <script src="https://cdn.maptiler.com/mapbox-gl-leaflet/latest/leaflet-mapbox-gl.js"></script>
     <script type="text/javascript" src="{% static "js/render.js" %}"></script>
 {% endblock %}