X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;ds=inline;f=experimental%2Fpalette%2Findex.html;h=8951811fa19543ce06edbb1bd60db0dbf87ec85c;hb=c715be428d83d80c0a26fd60dc5bc36fb4c908d9;hp=3a4536bf39e4ff62b952947aefa6e21ab7e87981;hpb=6814f34bd42b51019b3adb525ca3ce71f1f9fb63;p=dygraphs.git
diff --git a/experimental/palette/index.html b/experimental/palette/index.html
index 3a4536b..8951811 100644
--- a/experimental/palette/index.html
+++ b/experimental/palette/index.html
@@ -29,68 +29,76 @@
- Other messages:
-
-
-
Learn By Doing
-
- - In the filter box, type
point
.
- - In the drawPoints text box, toggle the value until
true
appears
- - You will see dots on the graph where points exist.
- - In the pointSize text box, enter
5
- - Press
enter
or click Refresh. The dots
- just got larger.
- - Type
callback
in the filter box.
- - Instead of a text box, you will see buttons that can be used
- to define callbacks. Click the button for clickCallback.
- - You will see that the prototype function body is
-
function(e, x, points){ }
. Paste in this
- replacement function:
- function(e, x){
var elem =
- document.getElementById("messages");
elem.innerHTML =
- elem.innerHTML + x + "<br>";
}
- - Click the OK button. The clickCallback
- button now says
defined
instead of not defined
.
- - Click anywhere on the graph. The x-value will appear on the
- page.
- - If you click directly on a point, then an alert box will
- indicate that you've clicked on a point. That's because the
- pointClickCallback was defined already.
- - Have fun and send feedback!
-
-
tips
- The palette on the right contains (most) Dygraphs options. Here's
- how they work:
-
- - The selection box on top can be used to choose your own data source.
- - Use the filter box to constrain your selection. For instance,
- typing
draw
will show all options with that phrase in
- its name.
- - Each field has specific types. The types are not documented,
- but if you hover over an entry (or click on it) it will give you a
- hint.
- - Enter a new value for the option, and hit the
-
enter
key, or the Refresh button.
- - Some types require special consideration:
-
- integers, floats, strings and booleans can be entered
- as-is.
- - arrays of elements can be comma-separated except string
- arrays, which are (at the moment) semicolon-separated (anyone
- interested in making a good string array parser, take a shot.
- - Callbacks are defined in a (crappy tiny) dialog box. If the
- function isn't defined, then a prototype of the function will be
- presented to the user.
-
-
-
- Then in the filter text box, type "point". Set drawPoints: true and
- pointSize: 5.
- You get the idea.
+
+
instructions
+
+
Learn By Doing
+
+ - In the filter box, type
point
.
+ - Click the drawPoints toggle button until
true
appears
+ - You will see dots on the graph where points exist.
+ - In the pointSize text box, enter
5
+ - Press
enter
or click Refresh. The dots
+ just got larger.
+ - Type
callback
in the filter box.
+ - Instead of a text box, you will see buttons that can be used
+ to define callbacks. Click the button for clickCallback.
+ - You will see that the prototype function body is
+
function(e, x, points){ }
. Paste in this
+ replacement function:
+ function(e, x){
var elem =
+ document.getElementById("messages");
elem.innerHTML =
+ elem.innerHTML + x + "<br>";
}
+ - Click the OK button. The clickCallback
+ button now says
defined
instead of not defined
.
+ - Click anywhere on the graph. The x-value will appear on the
+ page.
+ - If you click directly on a point, then an alert box will
+ indicate that you've clicked on a point. That's because the
+ pointClickCallback was defined already.
+ - Have fun and send feedback!
+
+
tips
+ The palette on the right contains (most) Dygraphs options. Here's
+ how they work:
+
+ - The selection box on top can be used to choose your own data source.
+ - Use the filter box to constrain your selection. For instance,
+ typing
draw
will show all options with that phrase in
+ its name.
+ - Each field has specific types. The types are not documented,
+ but if you hover over an entry (or click on it) it will give you a
+ hint.
+ - Enter a new value for the option, and hit the
+
enter
key, or the Refresh button.
+ - Some types require special consideration:
+
- integers, floats, strings and booleans can be entered
+ as-is.
+ - arrays of elements can be comma-separated except string
+ arrays, which are (at the moment) semicolon-separated (anyone
+ interested in making a good string array parser, take a shot.
+ - Callbacks are defined in a (crappy tiny) dialog box. If the
+ function isn't defined, then a prototype of the function will be
+ presented to the user.
+
+
+
+ Then in the filter text box, type "point". Set drawPoints: true and
+ pointSize: 5.
+ You get the idea.
+
|