Update map dependencies in examples (#8616)

visgl · Mar 10, 2024 · 33a861c · 33a861c
1 parent 29980be
commit 33a861c
Show file tree

Hide file tree

Showing 112 changed files with 482 additions and 393 deletions.
diff --git a/examples/experimental/h3-grid/index.html b/examples/experimental/h3-grid/index.html
@@ -4,7 +4,7 @@
   <meta charset="utf-8">
   <title>deck.gl Example</title>
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+  <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
   <style>
     body {margin: 0; font-family: sans-serif; width: 100vw; height: 100vh; overflow: hidden;}
   </style>

diff --git a/examples/experimental/h3-grid/package.json b/examples/experimental/h3-grid/package.json
@@ -10,10 +10,10 @@
   },
   "dependencies": {
     "deck.gl": "^8.8.0",
-    "maplibre-gl": "^2.4.0",
+    "maplibre-gl": "^3.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "react-map-gl": "^7.0.0"
+    "react-map-gl": "^7.1.0"
   },
   "devDependencies": {
     "typescript": "^4.6.0",

diff --git a/examples/experimental/h3-grid/src/app.jsx b/examples/experimental/h3-grid/src/app.jsx
@@ -3,8 +3,7 @@ import {createRoot} from 'react-dom/client';
 import DeckGL from '@deck.gl/react';
 import {MapView} from '@deck.gl/core';
 
-import {Map} from 'react-map-gl';
-import maplibregl from 'maplibre-gl';
+import {Map} from 'react-map-gl/maplibre';
 
 import H3GridLayer from './h3-grid-layer';
 import {getMinZoom} from './h3-utils';
@@ -75,7 +74,7 @@ export default function App() {
         onViewStateChange={onViewStateChange}
         getTooltip={info => info.object}
       >
-        <Map mapLib={maplibregl} mapStyle={MAP_STYLE} />
+        <Map mapStyle={MAP_STYLE} />
       </DeckGL>
       <div style={CONTROL_PANEL_STYLE}>
         <div>Resolution: {resolution}</div>

diff --git a/examples/gallery/src/arc-layer.html b/examples/gallery/src/arc-layer.html
@@ -4,9 +4,9 @@
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
     <script src="https://d3js.org/d3.v5.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' /> 
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' /> 
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/bitmap-layer.html b/examples/gallery/src/bitmap-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl BitmapLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/boiler-plate.html b/examples/gallery/src/boiler-plate.html
@@ -2,8 +2,8 @@
   <head>
     <title>Get Started with deck.gl and Mapbox</title>
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />    
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />    
   </head>
 
   <body style="margin:0; width: 100vw; height: 100vh;"></body>

diff --git a/examples/gallery/src/column-layer.html b/examples/gallery/src/column-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl ColumnLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/contour-layer.html b/examples/gallery/src/contour-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl ContourLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/geojson-layer.html b/examples/gallery/src/geojson-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl GeoJsonLayer (Polygon) Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/great-circle-layer.html b/examples/gallery/src/great-circle-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl GreatCircleLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/hexagon-layer.html b/examples/gallery/src/hexagon-layer.html
@@ -4,9 +4,9 @@
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
     <script src="https://d3js.org/d3.v5.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         font-family: Helvetica, Arial, sans-serif;

diff --git a/examples/gallery/src/highway.html b/examples/gallery/src/highway.html
@@ -4,9 +4,9 @@
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
     <script src="https://d3js.org/d3.v5.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/icon-layer.html b/examples/gallery/src/icon-layer.html
@@ -5,9 +5,9 @@
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/rest.js/15.2.6/octokit-rest.min.js"></script>
     <script src="https://d3js.org/d3.v7.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/line-layer.html b/examples/gallery/src/line-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl LineLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/scatterplot-layer.html b/examples/gallery/src/scatterplot-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl ScatterplotLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/screengrid-layer.html b/examples/gallery/src/screengrid-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl ScreenGridLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/text-layer.html b/examples/gallery/src/text-layer.html
@@ -3,9 +3,9 @@
     <title>deck.gl TextLayer Example</title>
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/gallery/src/tile-3d-layer.html b/examples/gallery/src/tile-3d-layer.html
@@ -3,9 +3,9 @@
   <title>deck.gl Tile3DLayer</title>
   <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
   <script src="https://unpkg.com/@loaders.gl/i3s@^2.3.0/dist/dist.min.js"></script>
-  <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+  <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-  <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+  <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
 </head>
 
 <body style="margin:0; width: 100vw; height: 100vh;"></body>

diff --git a/examples/gallery/src/viewport-transition.html b/examples/gallery/src/viewport-transition.html
@@ -4,9 +4,9 @@
 
     <script src="https://unpkg.com/deck.gl@^8.8.0/dist.min.js"></script>
     <script src="https://d3js.org/d3.v5.min.js"></script>
-    <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
+    <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
 
-    <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+    <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     <style type="text/css">
       body {
         width: 100vw;

diff --git a/examples/get-started/pure-js/carto/index.html b/examples/get-started/pure-js/carto/index.html
@@ -24,7 +24,7 @@
                 height: 100%;
             }
         </style>
-        <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+        <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
     </head>
     <body>
         <div id="container">

diff --git a/examples/get-started/pure-js/carto/package.json b/examples/get-started/pure-js/carto/package.json
@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "deck.gl": "^9.0.0-beta.2",
-    "maplibre-gl": "^2.4.0"
+    "maplibre-gl": "^3.0.0"
   },
   "devDependencies": {
     "vite": "^4.0.0"

diff --git a/examples/get-started/react/mapbox/package.json b/examples/get-started/react/mapbox/package.json
@@ -13,7 +13,7 @@
     "mapbox-gl": "^3.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "react-map-gl": "^7.0.0"
+    "react-map-gl": "^7.1.0"
   },
   "devDependencies": {
     "vite": "^4.0.0"

diff --git a/examples/get-started/react/maplibre/package.json b/examples/get-started/react/maplibre/package.json
@@ -13,7 +13,7 @@
     "maplibre-gl": "^3.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "react-map-gl": "^7.0.0"
+    "react-map-gl": "^7.1.0"
   },
   "devDependencies": {
     "vite": "^4.0.0"

diff --git a/examples/get-started/scripting/carto/index.html b/examples/get-started/scripting/carto/index.html
@@ -4,8 +4,8 @@
         <script src="https://unpkg.com/deck.gl@^9.0.0-beta.2/dist.min.js"></script>
         <script src="https://unpkg.com/@deck.gl/carto@^9.0.0-beta.2/dist.min.js"></script>
         <!-- Maplibre dependencies -->
-        <script src='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js'></script>
-        <link href='https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.css' rel='stylesheet' />
+        <script src='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.js'></script>
+        <link href='https://unpkg.com/maplibre-gl@3.6.0/dist/maplibre-gl.css' rel='stylesheet' />
 
         <title>CARTO deck.gl example</title>
         <style type="text/css">

diff --git a/examples/layer-browser/index.html b/examples/layer-browser/index.html
@@ -4,7 +4,6 @@
     <meta charset='UTF-8' />
     <title>deck.gl example</title>
     <link href="app.css" rel="stylesheet">
-    <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v1.13.0/mapbox-gl.css' rel='stylesheet' />
   </head>
   <body>
     <script type="module" src='src/index.jsx'></script>

diff --git a/examples/layer-browser/package.json b/examples/layer-browser/package.json
@@ -10,15 +10,15 @@
   "dependencies": {
     "@loaders.gl/ply": "^4.2.0-alpha.5",
     "@loaders.gl/gltf": "^4.2.0-alpha.5",
-    "@luma.gl/debug": "9.0.0-beta.8",
     "colorbrewer": "^1.0.0",
     "d3-request": "^1.0.6",
     "d3-scale": "^3.1.0",
     "extrude-polyline": "^1.0.6",
+    "maplibre-gl": "^3.0.0",
     "react": "^16.3.0",
     "react-autobind": "^1.0.6",
     "react-dom": "^16.3.0",
-    "react-map-gl": "^5.3.0",
+    "react-map-gl": "^7.1.0",
     "react-stats-zavatta": "^0.0.6"
   },
   "devDependencies": {

diff --git a/examples/layer-browser/src/data-samples.js b/examples/layer-browser/src/data-samples.js
@@ -4,21 +4,34 @@ import {Vector3} from '@math.gl/core';
 import allPoints from '../data/sf.bike.parking.json' assert { type: 'json' };
 import {pointGrid} from './utils';
 import {pointsToWorldGrid} from './utils/grid-aggregator';
-import {default as meterTrajectorySmall} from '../data/meter-trajectory-small.json' assert { type: 'json' };
-
-import {default as choropleths} from '../data/sf.zip.geo.json' assert { type: 'json' };
-export {default as geojson} from '../data/sample.geo.json' assert { type: 'json' };
-export {default as geojsonHole} from '../data/hole.geo.json' assert { type: 'json' };
-export {default as geojsonLarge} from '../data/canada.geo.json' assert { type: 'json' };
-export {default as hexagons} from '../data/hexagons.json' assert { type: 'json' };
-export {default as routes} from '../data/sfmta.routes.json' assert { type: 'json' };
-export {default as trips} from '../data/trips.json' assert { type: 'json' };
-export {default as SFTrips} from '../data/sf.trips.json' assert { type: 'json' };
-export {default as iconAtlas} from '../data/icon-atlas.json' assert { type: 'json' };
-export {default as quadkeys} from '../data/sf.quadkeys.json' assert { type: 'json' };
-export {default as s2cells} from '../data/sf.s2cells.json' assert { type: 'json' };
-export {default as geohashes} from '../data/sf.geohashes.json' assert { type: 'json' };
-export {choropleths};
+import meterTrajectorySmall from '../data/meter-trajectory-small.json' assert { type: 'json' };
+import choropleths from '../data/sf.zip.geo.json' assert { type: 'json' };
+import geojson from '../data/sample.geo.json' assert { type: 'json' };
+import geojsonHole from '../data/hole.geo.json' assert { type: 'json' };
+import geojsonLarge from '../data/canada.geo.json' assert { type: 'json' };
+import hexagons from '../data/hexagons.json' assert { type: 'json' };
+import routes from '../data/sfmta.routes.json' assert { type: 'json' };
+import trips from '../data/trips.json' assert { type: 'json' };
+import SFTrips from '../data/sf.trips.json' assert { type: 'json' };
+import iconAtlas from '../data/icon-atlas.json' assert { type: 'json' };
+import quadkeys from '../data/sf.quadkeys.json' assert { type: 'json' };
+import s2cells from '../data/sf.s2cells.json' assert { type: 'json' };
+import geohashes from '../data/sf.geohashes.json' assert { type: 'json' };
+
+export {
+  choropleths,
+  geojson,
+  geojsonHole,
+  geojsonLarge,
+  hexagons,
+  routes,
+  trips,
+  SFTrips,
+  iconAtlas,
+  quadkeys,
+  s2cells,
+  geohashes
+};
 
 export const positionOrigin = [-122.42694203247012, 37.751537058389985];