Refactor imports in example

vasturiano · Dec 12, 2024 · 21eabfa · 21eabfa
1 parent 6e9c33a
commit 21eabfa
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/example/multiple-globes/globes.js b/example/multiple-globes/globes.js
@@ -1,4 +1,6 @@
 import { createElement, useMemo, useState, useEffect, useCallback } from 'react';
+import { csvParse, scaleSequentialSqrt, interpolateYlOrRd } from 'https://esm.sh/d3';
+import * as topojson from 'https://esm.sh/topojson-client';
 
 export const Points = ptProps => {
   const N = 300;
@@ -161,11 +163,11 @@ export const Population = ptProps => {
   useEffect(() => {
     // load data
     fetch('./data/world_population.csv').then(res => res.text())
-      .then(csv => d3.csvParse(csv, ({ lat, lng, pop }) => ({ lat: +lat, lng: +lng, pop: +pop })))
+      .then(csv => csvParse(csv, ({ lat, lng, pop }) => ({ lat: +lat, lng: +lng, pop: +pop })))
       .then(setPopData);
   }, []);
 
-  const weightColor = d3.scaleSequentialSqrt(d3.interpolateYlOrRd)
+  const weightColor = scaleSequentialSqrt(interpolateYlOrRd)
     .domain([0, 1e7]);
 
   return createElement(R3fGlobe, {

diff --git a/example/multiple-globes/index.html b/example/multiple-globes/index.html
@@ -32,9 +32,6 @@
   </script>
 
   <script src="//unpkg.com/@babel/standalone"></script>
-  <script src="//unpkg.com/d3"></script>
-  <script src="//unpkg.com/d3-dsv"></script>
-  <script src="//unpkg.com/topojson-client"></script>
 
   <script src="//unpkg.com/r3f-globe" defer></script>
 <!--  <script src="../../dist/r3f-globe.js" defer></script>-->