X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=tests%2Frange-selector.html;h=b257fe4d19721c7798fb8dcb380a1784f9672189;hb=056763ed22ccc5bdebc73355841052d0d6815a1f;hp=ade8a9856832eb051d99293c3fc34d06f78da97f;hpb=804fd99934fcdbee8b50b79561af0583cd94d805;p=dygraphs.git

diff --git a/tests/range-selector.html b/tests/range-selector.html
index ade8a98..b257fe4 100644
--- a/tests/range-selector.html
+++ b/tests/range-selector.html
@@ -6,7 +6,7 @@
     For production (minified) code, use:
     <script type="text/javascript" src="dygraph-combined.js"></script>
     -->
-    <script type="text/javascript" src="../dygraph-dev.js"></script>
+    <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <script type="text/javascript" src="data.js"></script>
     <style type="text/css">
@@ -25,8 +25,13 @@
       No roll period.
     </p>
     <div id="noroll" style="width:800px; height:320px;"></div>
+
+    <h2 id="options">Range selector options</h2>
+    <p>Here's a view of how the various <a href="../options.html#Range%20Selector">range selector options</a> affect the display:</p>
+    <img width="954" height="354" src="range-selector-anatomy.png">
+
     <p>
-      Roll period of 14 timesteps, custom range selector height and plot color.
+      Roll period of 14 timesteps, various custom range selector options.
     </p>
     <div id="roll14" style="width:800px; height:320px;"></div>
     <p>
@@ -34,6 +39,7 @@
       The default behaviour is to compute the average of <em>all</em> series.
     </p>
     <div id="selectcombined" style="width:800px; height:320px;"></div>
+
     <p>
       Demo of range selecor without the chart. (interesting if multiple charts should be synced with one range selector).
     </p>
@@ -72,9 +78,16 @@
             labelsDivStyles: { 'textAlign': 'right' },
             xAxisHeight: 14,
             showRangeSelector: true,
-            rangeSelectorHeight: 30,
-            rangeSelectorPlotStrokeColor: 'yellow',
-            rangeSelectorPlotFillColor: 'lightyellow'
+            rangeSelectorHeight: 80,
+            rangeSelectorPlotStrokeColor: 'purple',
+            rangeSelectorPlotFillColor: 'black',
+            rangeSelectorBackgroundStrokeColor: 'orange',
+            rangeSelectorBackgroundLineWidth: 4,
+            rangeSelectorPlotLineWidth: 5,
+            rangeSelectorForegroundStrokeColor: 'brown',
+            rangeSelectorForegroundLineWidth: 8,
+            rangeSelectorAlpha: 0.5,
+            rangeSelectorPlotFillGradientColor: 'red'
           }
       );
       g3 = new Dygraph(
@@ -105,6 +118,7 @@
                 drawAxis : false
               }
             },
+            labels: ['X', 'Y'],
             showRangeSelector: true,
             rangeSelectorHeight: 30
           }