Export a d3 global in vanilla JS

johnwalley · Nov 9, 2017 · ad615d1 · ad615d1
1 parent 8db8719
commit ad615d1
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 194 deletions.
diff --git a/example/index.html b/example/index.html
@@ -5,11 +5,9 @@
 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
 <script src="https://d3js.org/d3.v4.min.js"></script>
-<!--<script src="https://unpkg.com/[email protected]/build/d3-simple-slider.js"></script>-->
 <script src="../build/d3-simple-slider.js"></script>
 
-<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb"
-  crossorigin="anonymous">
+<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
 
 <body>
   <div class="container">
@@ -69,7 +67,7 @@ <h1>Transition example</h1>
 <script>
   var data1 = [0, 0.005, 0.01, 0.015, 0.02, 0.025];
 
-  var slider1 = d3Slider.sliderHorizontal()
+  var slider1 = d3.sliderHorizontal()
     .min(d3.min(data1))
     .max(d3.max(data1))
     .width(300)
@@ -91,7 +89,7 @@ <h1>Transition example</h1>
   d3.select("p#value1").text(d3.format('.2%')(slider1.value()))
   d3.select("a#setValue1").on("click", () => slider1.value(0.015));
 
-  var slider2 = d3Slider.sliderHorizontal()
+  var slider2 = d3.sliderHorizontal()
     .min(0)
     .max(10)
     .step(1)
@@ -114,7 +112,7 @@ <h1>Transition example</h1>
 
   var data3 = d3.range(0, 10).map(function (d) { return new Date(1995 + d, 10, 3); });
 
-  var slider3 = d3Slider.sliderHorizontal()
+  var slider3 = d3.sliderHorizontal()
     .min(d3.min(data3))
     .max(d3.max(data3))
     .step(1000 * 60 * 60 * 24 * 365)
@@ -138,7 +136,7 @@ <h1>Transition example</h1>
 
   var data4 = [0.20, 0.22, 0.24, 0.26, 0.28, 0.30, 1];
 
-  var slider4 = d3Slider.sliderHorizontal()
+  var slider4 = d3.sliderHorizontal()
     .min(d3.min(data4))
     .max(d3.max(data4))
     .width(300)
@@ -161,7 +159,7 @@ <h1>Transition example</h1>
   d3.select("p#value4").text(d3.format('.2%')(slider4.value()))
   d3.select("a#setValue4").on("click", () => slider4.value(0.015));
 
-  var slider5 = d3Slider.sliderHorizontal()
+  var slider5 = d3.sliderHorizontal()
     .min(0)
     .max(10)
     .step(1)

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "d3-simple-slider",
-  "version": "0.1.7",
-  "description": "Displays an SVG slider",
+  "version": "0.2.0",
+  "description": "Renders an SVG slider",
   "keywords": ["d3", "d3-module", "slider", "visualization"],
   "homepage": "https://github.com/johnwalley/d3-simple-slider",
   "license": "BSD-3-Clause",
@@ -18,7 +18,7 @@
   },
   "scripts": {
     "pretest":
-      "rm -rf build && mkdir build && rollup --banner \"$(preamble)\" -f umd -g d3:d3 -n d3Slider -o build/d3-simple-slider.js -- index.js",
+      "rm -rf build && mkdir build && rollup --banner \"$(preamble)\" -f umd -g d3-array:d3,d3-axis:d3,d3-dispatch:d3,d3-drag:d3,d3-ease:d3,d3-scale:d3,d3-selection:d3 -n d3 -o build/d3-simple-slider.js --extend -- index.js",
     "test": "tape 'test/**/*-test.js' && eslint index.js src",
     "prepublish":
       "npm run test && uglifyjs --preamble \"$(preamble)\" build/d3-simple-slider.js -c -m -o build/d3-simple-slider.min.js",
@@ -34,6 +34,13 @@
     "uglify-js": "^3.1.4"
   },
   "dependencies": {
-    "d3": "^4.11.0"
+    "d3-array": "^1.2.1",
+    "d3-axis": "^1.0.8",
+    "d3-brush": "^1.0.4",
+    "d3-dispatch": "^1.0.3",
+    "d3-drag": "^1.2.1",
+    "d3-ease": "^1.0.3",
+    "d3-scale": "^1.0.6",
+    "d3-selection": "^1.1.0"
   }
 }