Add range-selector

diff --git a/gallery/gallery.js b/gallery/gallery.js
index dc50813..10128ff 100644 (file)
--- a/gallery/gallery.js
+++ b/gallery/gallery.js
@@ -70,7 +70,9 @@ Gallery.register = function(id, demo) {
 };
 
 Gallery.hashChange = function(event) {
-  var id = location.hash.substring(1) + "-toc";
-  var elem = document.getElementById(id);
-  elem.onclick();
+  if (location.hash) {
+    var id = location.hash.substring(1) + "-toc";
+    var elem = document.getElementById(id);
+    elem.onclick();
+  }
 };
\ No newline at end of file

diff --git a/gallery/index.html b/gallery/index.html
index af021e5..13d6ab0 100644 (file)
--- a/gallery/index.html
+++ b/gallery/index.html
@@ -22,6 +22,7 @@
     <script src="link-interaction.js"></script>
     <script src="per-series.js"></script>
     <script src="synchronize.js"></script>
+    <script src="range-selector.js"></script>
 
     <!-- These might not remain in the gallery -->
     <script src="dygraph-simple.js"></script>

diff --git a/gallery/range-selector.js b/gallery/range-selector.js
new file mode 100644 (file)
index 0000000..4d9a82a
--- /dev/null
+++ b/gallery/range-selector.js
@@ -0,0 +1,43 @@
+Gallery.register(
+  'range-selector',
+  {
+    name: 'Range Selector',
+    title: 'Demo of the Range Selector',
+    setup: function(parent) {
+      parent.innerHTML =
+          "<p>No roll period.</p>" +
+          "<div id='noroll' style='width:800px; height:320px;'></div>" +
+          "<p>Roll period of 14 timesteps, custom range selector height and plot color.</p>" +
+          "<div id='roll14' style='width:800px; height:320px;'></div>";
+    },
+    run: function() {
+      g1 = new Dygraph(
+          document.getElementById("noroll"),
+          data_temp,
+          {
+            customBars: true,
+            title: 'Daily Temperatures in New York vs. San Francisco',
+            ylabel: 'Temperature (F)',
+            legend: 'always',
+            labelsDivStyles: { 'textAlign': 'right' },
+            showRangeSelector: true
+          }
+      );
+      g2 = new Dygraph(
+          document.getElementById("roll14"),
+          data_temp,
+          {
+            rollPeriod: 14,
+            showRoller: true,
+            customBars: true,
+            title: 'Daily Temperatures in New York vs. San Francisco',
+            ylabel: 'Temperature (F)',
+            legend: 'always',
+            labelsDivStyles: { 'textAlign': 'right' },
+            showRangeSelector: true,
+            rangeSelectorHeight: 30,
+            rangeSelectorPlotStrokeColor: 'yellow',
+            rangeSelectorPlotFillColor: 'lightyellow'
+          });
+    }
+  });