X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;ds=inline;f=docs%2Fper-axis.html;h=09c6ebc1a149744cc7c4e28d50a429b59b03a1a8;hb=92588fa1956f9e9e71e53e170a57048efed35c87;hp=25f632b1d2c7a84394e90c6d1650c846da8ca16b;hpb=48e614acf3084b9836803f8b014bf0e65f1ca119;p=dygraphs.git diff --git a/docs/per-axis.html b/docs/per-axis.html index 25f632b..09c6ebc 100644 --- a/docs/per-axis.html +++ b/docs/per-axis.html @@ -1,110 +1,89 @@ - - -
- -When you create a Dygraph object, your code looks something like - this:
- -
- g = new Dygraph(document.getElementById("div"),
- data,
- { options });
-
-
- This document is about some of the values you can put in the - options parameter.
- -Typically, an option applies to the whole chart: if you set the - strokeWidth option, it will apply to all data-series equally:
- -
- g = new Dygraph(document.getElementById("div"),
- "X,Y1,Y2,Y3\n" +
- "1,2,3,4\n" +
- ...,
- {
- strokeWidth: 5
- });
-
-
- Some options, however, can be applied on a per-series or a per-axis - basis. For instance, to set three different strokeWidths, you could - write:
- -
- g = new Dygraph(document.getElementById("div"),
- "X,Y1,Y2,Y3\n" +
- "1,2,3,4\n" +
- ...,
- {
- strokeWidth: 5, // default stroke width
- 'Y1': {
- strokeWidth: 3 // Y1 gets a special value.
- },
- 'Y3': {
- strokeWidth: 1 // so does Y3.
+
+dygraphs per-series and per-axis options
+
+When you create a Dygraph object, your code looks something like
+this:
+
+
+ g = new Dygraph(document.getElementById("div"),
+ data,
+ { options });
+
+
+This document is about some of the values you can put in the
+options parameter.
+
+per-series options
+
+Typically, an option applies to the whole chart: if you set the
+strokeWidth option, it will apply to all data-series equally:
+
+
+ g = new Dygraph(document.getElementById("div"),
+ "X,Y1,Y2,Y3\n" +
+ "1,2,3,4\n" +
+ ...,
+ {
+ strokeWidth: 5
+ });
+
+
+Some options, however, can be applied on a per-series or a per-axis
+basis. For instance, to set three different strokeWidths, you could
+write:
+
+
+ g = new Dygraph(document.getElementById("div"),
+ "X,Y1,Y2,Y3\n" +
+ "1,2,3,4\n" +
+ ...,
+ {
+ strokeWidth: 5, // default stroke width
+ series: {
+ Y1: {
+ strokeWidth: 3 // Y1 gets a special value.
+ },
+ Y3: {
+ strokeWidth: 1 // so does Y3.
+ }
+ }
+ });
+
+
+The result of these options is that Y1 will have a strokeWidth of 1, Y2 will have a strokeWidth of 5 and Y3 will have a strokeWidth of 1. You can see a demonstration of this here.
+
+per-axis options
+
+Some options make more sense when applied to an entire axis, rather than to individual series. For instance, the axisLabelFormatter option lets you specify a function for format the labels on axis tick marks for display. You might want one function for the x-axis and another one for the y-axis.
+
+Here's how you can do that:
+
+
+ g = new Dygraph(document.getElementById("div"),
+ "X,Y1,Y2,Y3\n" +
+ "1,2,3,4\n" +
+ ...,
+ {
+ axes: {
+ x: {
+ axisLabelFormatter: function(x) {
+ return 'x' + x;
}
- });
-
-
- The result of these options is that Y1 will have a strokeWidth of 1, Y2 will have a strokeWidth of 5 and Y3 will have a strokeWidth of 1. You can see a demonstration of this here.
- -Some options make more sense when applied to an entire axis, rather than to individual series. For instance, the axisLabelFormatter option lets you specify a function for format the labels on axis tick marks for display. You might want one function for the x-axis and another one for the y-axis.
- -Here's how you can do that:
- -
- g = new Dygraph(document.getElementById("div"),
- "X,Y1,Y2,Y3\n" +
- "1,2,3,4\n" +
- ...,
- {
- axes: {
- x: {
- axisLabelFormatter: function(x) {
- return 'x' + x;
- }
- },
- y: {
- axisLabelFormatter: function(y) {
- return 'y' + y;
- }
- }
+ },
+ y: {
+ axisLabelFormatter: function(y) {
+ return 'y' + y;
}
- });
-
-
- The keys in the 'axes' option are always 'x', 'y' and, if you have a - secondary y-axis, 'y2'. If you set the "axisLabelFormatter" option at the - top level, it will apply to all axes.
- -To see this in practice, check out the two-axes test.
- - - - - + } + } + }); + + +The keys in the 'axes' option are always 'x', 'y' and, if you have a +secondary y-axis, 'y2'. If you set the "axisLabelFormatter" option at the +top level, it will apply to all axes.
+ +To see this in practice, check out the two-axes test.
+ +