Add a simple demo as a self-contained example

[dygraphs.git] / dygraph-options-reference.js

diff --git a/dygraph-options-reference.js b/dygraph-options-reference.js
index 9217f3d..cb8b767 100644 (file)
--- a/dygraph-options-reference.js
+++ b/dygraph-options-reference.js
@@ -41,19 +41,36 @@ Dygraph.OPTIONS_REFERENCE =  // <JSON>
     "default": "false",
     "labels": ["Data Line display"],
     "type": "boolean",
-    "description": "Draw a small dot at each point, in addition to a line going through the point. This makes the individual data points easier to see, but can increase visual clutter in the chart. The small dot can be replaced with a custom rendering by supplying a drawPointCallback."
+    "description": "Draw a small dot at each point, in addition to a line going through \
+        the point. This makes the individual data points easier to see, but  \
+        can increase visual clutter in the chart. The small dot can be \
+        replaced with a custom rendering by supplying a \
+        <a href='#drawPointCallback'>drawPointCallback</a>."
   },
   "drawPointCallback": {
     "default": "null",
     "labels": ["Data Line display"],
     "type": "function(g, seriesName, canvasContext, cx, cy, color, pointSize)",
-    "description": "Draw a custom item when drawPoints is enabled. Default is a small dot matching the series color."
+    "parameters": [
+      [ "g" , "the reference graph" ],
+      [ "seriesName" , "the name of the series" ],
+      [ "canvasContext" , "the canvas to draw on" ],
+      [ "cx" , "center x coordinate" ],
+      [ "cy" , "center y coordinate" ],
+      [ "color" , "series color" ],
+      [ "pointSize" , "the radius of the image." ]
+    ],
+    "description": "Draw a custom item when drawPoints is enabled. \
+        Default is a small dot matching the series color. This method \
+        should constrain drawing to within pointSize pixels from (cx, cy). \
+        Also see <a href='#drawHighlightPointCallback'>drawHighlightPointCallback</a>"
   },
   "height": {
     "default": "320",
     "labels": ["Overall display"],
     "type": "integer",
-    "description": "Height, in pixels, of the chart. If the container div has been explicitly sized, this will be ignored."
+    "description": "Height, in pixels, of the chart. If the container div has \
+      been explicitly sized, this will be ignored."
   },
   "zoomCallback": {
     "default": "null",
@@ -64,7 +81,8 @@ Dygraph.OPTIONS_REFERENCE =  // <JSON>
       [ "maxDate" , "milliseconds since epoch." ],
       [ "yRanges" , "is an array of [bottom, top] pairs, one for each y-axis." ]
     ],
-    "description": "A function to call when the zoom window is changed (either by zooming in or out)."
+    "description": "A function to call when the zoom window is changed (either \
+      by zooming in or out)."
   },
   "pointClickCallback": {
     "snippet": "function(e, point){<br>&nbsp;&nbsp;alert(point);<br>}",
@@ -107,7 +125,19 @@ Dygraph.OPTIONS_REFERENCE =  // <JSON>
     "default": "null",
     "labels": ["Data Line display"],
     "type": "function(g, seriesName, canvasContext, cx, cy, color, pointSize)",
-    "description": "Draw a custom item when a point is highlighted. Default is a small dot matching the series color."
+    "parameters": [
+      [ "g" , "the reference graph" ],
+      [ "seriesName" , "the name of the series" ],
+      [ "canvasContext" , "the canvas to draw on" ],
+      [ "cx" , "center x coordinate" ],
+      [ "cy" , "center y coordinate" ],
+      [ "color" , "series color" ],
+      [ "pointSize" , "the radius of the image." ]
+    ],
+    "description": "Draw a custom item when a point is highlighted. \
+        Default is a small dot matching the series color. This method \
+        should constrain drawing to within pointSize pixels from (cx, cy) \
+        Also see <a href='#drawPointCallback'>drawPointCallback</a>"
   },
   "highlightSeriesOpts": {
     "default": "null",
@@ -115,17 +145,11 @@ Dygraph.OPTIONS_REFERENCE =  // <JSON>
     "type": "Object",
     "description": "When set, the options from this object are applied to the timeseries closest to the mouse pointer for interactive highlighting. See also 'highlightCallback'. Example: highlightSeriesOpts: { strokeWidth: 3 }."
   },
-  "highlightSeriesBackgroundFade": {
-    "default": "0",
-    "labels": ["Interactive Elements"],
-    "type": "number",
-    "description": "When nonzero, dim the background while highlighting series. 0=fully visible, 1=hidden"
-  },
-  "highlightSeriesAnimate": {
-    "default": "false",
+  "highlightSeriesBackgroundAlpha": {
+    "default": "0.5",
     "labels": ["Interactive Elements"],
-    "type": "boolean",
-    "description": "Animate the background dimming for nonzero highlightSeriesBackgroundFade."
+    "type": "float",
+    "description": "Fade the background while highlighting series. 1=fully visible background (disable fading), 0=hiddden background (show highlighted series only)."
   },
   "includeZero": {
     "default": "false",