var variantOpts = {
none: {},
- avoidMinZero: {
- avoidMinZero: true,
- includeZero: true
- },
padded: {
includeZero: true,
drawAxesAtZero: true,
// THE SOFTWARE.
-/**
+/**
* @fileoverview Test valueRange and dateWindow changes.
*
* @author konigsberg@google.com (Robert Konigsberg)
}());
var FIVE_TO_ONE_THOUSAND = [
- [ 1, 10 ], [ 2, 20 ], [ 3, 30 ], [ 4, 40 ] , [ 5, 50 ],
+ [ 1, 10 ], [ 2, 20 ], [ 3, 30 ], [ 4, 40 ] , [ 5, 50 ],
[ 6, 60 ], [ 7, 70 ], [ 8, 80 ], [ 9, 90 ] , [ 10, 1000 ]];
describe("range-tests", function() {
g.updateOptions({ });
assert.deepEqual([12, 18], g.xAxisRange());
assert.deepEqual([10, 40], g.yAxisRange(0));
-
+
g.updateOptions({valueRange : null, axes: {y:{valueRange : [15, 20]}}});
assert.deepEqual([12, 18], g.xAxisRange());
assert.deepEqual([15, 20], g.yAxisRange(0));
labels: ['X', 'Y']
});
assert.deepEqual([10, 1099], g.yAxisRange(0));
-
+
g.updateOptions({ logscale : false });
assert.deepEqual([0, 1099], g.yAxisRange(0));
});
labels: ['X', 'Y']
});
assert.deepEqual([0, 1100], g.yAxisRange(0));
-
+
g.updateOptions({ includeZero : false });
assert.deepEqual([450, 1050], g.yAxisRange(0));
});
* Verify that includeZero range is properly specified per axis.
*/
it('testIncludeZeroPerAxis', function() {
- var g = new Dygraph("graph",
+ var g = new Dygraph("graph",
'X,A,B\n'+
'0,50,50\n'+
'50,110,110\n',
{
drawPoints: true,
pointSize:5,
- series:{
+ series:{
A: {
axis: 'y',
pointSize: 10
B: {
axis: 'y2'
}
- },
+ },
axes: {
'y2': { includeZero: true }
}
/**
* Verify that very large Y ranges don't break things.
- */
+ */
it('testHugeRange', function() {
var g = new Dygraph("graph", [[0, -1e120], [1, 1e230]], {
includeZero: true,
});
/**
- * Verify old-style avoidMinZero option.
- */
-it('testAvoidMinZero', function() {
- var g = createGraph({
- avoidMinZero: true,
- }, ZERO_TO_FIFTY_STEPS, [10, 20], [-5, 55]);
-});
-
-/**
* Verify ranges with user-specified padding, implicit avoidMinZero.
*/
it('testPaddingAuto', function() {
});
/**
- * Verify scrolling all-zero region, traditional.
- */
-it('testZeroScroll', function() {
- var g = new Dygraph(
- document.getElementById("graph"),
- "X,Y\n" +
- "1,0\n" +
- "8,0\n" +
- "9,0.1\n",
- {
- drawAxesAtZero: true,
- animatedZooms: true,
- avoidMinZero: true
- });
-});
-
-/**
* Verify scrolling all-zero region, new-style.
*/
it('testZeroScroll2', function() {
+++ /dev/null
-/*global Gallery,Dygraph,data */
-Gallery.register(
- 'avoid-min-zero',
- {
- name: "Avoid Min Zero",
- setup: function(parent) {
- parent.innerHTML =
- "<p>1: Line chart with axis at zero problem:</p><div id='graph1'></div> " +
- "<p>2: Step chart with axis at zero problem:</p><div id='graphd2'></div> " +
- "<p>3: Line chart with <code>avoidMinZero</code> option:</p><div id='graph3'></div> " +
- "<p>4: Step chart with <code>avoidMinZero</code> option:</p><div id='graphd4'></div> ";
- },
- run: function() {
- new Dygraph(document.getElementById("graph1"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n"
- );
- new Dygraph(document.getElementById("graphd2"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- stepPlot: true
- }
- );
- new Dygraph(document.getElementById("graph3"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- avoidMinZero: true
- }
- );
- new Dygraph(document.getElementById("graphd4"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- stepPlot: true,
- avoidMinZero: true
- }
- );
- }
-});
+++ /dev/null
-/*global Gallery,Dygraph,data */
-Gallery.register(
- 'edge-padding',
- {
- name: 'Edge Padding',
- title: 'Graph edge padding and axis position',
- setup: function(parent) {
- parent.innerHTML = (
- "<style>.dygraph-legend { width: 100px; }</style>" +
- "<p>" +
- " <b>Mode:</b>" +
- " <input type='radio' name='mode'>use {x,y}RangePad</input>" +
- " <input type='radio' name='mode'>original</input>" +
- " <br /><b>Settings:</b>" +
- " <input type='checkbox' id='yrange'>valueRange=[-2,2]</input>" +
- "</p>" +
- "<div id='demodiv'></div>"
- );
- },
- run: function() {
- var parent = document.getElementById("demodiv");
-
- var graphs = [];
- var nrows = 50;
-
- for (var oy = -2; oy <= 2; ++oy) {
- for (var ox = -1; ox <= 1; ++ox) {
- var gdiv = document.createElement('div');
- gdiv.style.display = 'inline-block';
- gdiv.style.margin = '2px';
- parent.appendChild(gdiv);
-
- var data = [];
- for (var row = 0; row < nrows; ++row) {
- var x = row * 5 / (nrows - 1);
- data.push([ox * 2.5 + x - 2.5,
- oy + Math.sin(x),
- oy + Math.round(Math.cos(x))]);
- }
-
- var g = new Dygraph(gdiv, data, {
- labels: ['x', 'A', 'B'],
- gridLineColor: '#ccc',
- includeZero: true,
- width: 250,
- height: 130
- });
- graphs.push(g);
- }
- parent.appendChild(document.createElement('br'));
- }
-
- var updateGraphOpts = function(opts) {
- for (var i = 0; i < graphs.length; ++i) {
- graphs[i].updateOptions(opts);
- }
- };
-
- var mode = document.getElementsByName('mode');
- mode[0].onchange = function() {
- updateGraphOpts({
- avoidMinZero: false,
- xRangePad: 3,
- yRangePad: 10,
- drawAxesAtZero: true});
- };
- mode[1].onchange = function() {
- updateGraphOpts({
- avoidMinZero: true,
- xRangePad: 0,
- yRangePad: null,
- drawAxesAtZero: false});
- };
- mode[0].checked = true;
- mode[0].onchange();
-
- var yrange = document.getElementById('yrange');
- yrange.onchange = function(ev) {
- updateGraphOpts({
- valueRange: ev.target.checked ? [-2, 2] : null});
- };
-
- }
- });
<script src="temperature-sf-ny.js"></script>
<script src="interaction.js"></script>
<script src="linear-regression.js"></script>
- <script src="edge-padding.js"></script>
<!-- These might not remain in the gallery
<script src="dygraph-simple.js"></script>
<script src="demo.js"></script>
<script src="border.js"></script>
<script src="callbacks.js"></script>
- <script src="avoid-min-zero.js"></script>
<script src="color-cycle.js"></script>
<script src="color-visibility.js"></script>
<script src="two-axes.js"></script>
legend: 'onmouseover',
stepPlot: false,
- avoidMinZero: false,
xRangePad: 0,
yRangePad: null,
drawAxesAtZero: false,
"type": "integer",
"description": "Number of pixels to leave blank at the right edge of the Dygraph. This makes it easier to highlight the right-most data point."
},
- "avoidMinZero": {
- "default": "false",
- "labels": ["Deprecated"],
- "type": "boolean",
- "description": "Deprecated, please use yRangePad instead. When set, the heuristic that fixes the Y axis at zero for a data set with the minimum Y value of zero is disabled. \nThis is particularly useful for data sets that contain many zero values, especially for step plots which may otherwise have lines not visible running along the bottom axis."
- },
"drawAxesAtZero": {
"default": "false",
"labels": ["Axis display"],
},
"timingName": {
"default": "null",
- "labels": [ "Debugging" ],
+ "labels": [ "Debugging", "Deprecated" ],
"type": "string",
"description": "Set this option to log timing information. The value of the option will be logged along with the timimg, so that you can distinguish multiple dygraphs on the same page."
},
//
// - backwards compatible (yRangePad not set):
// 10% padding for automatic Y ranges, but not for user-supplied
- // ranges, and move a close-to-zero edge to zero except if
- // avoidMinZero is set, since drawing at the edge results in
- // invisible lines. Unfortunately lines drawn at the edge of a
+ // ranges, and move a close-to-zero edge to zero, since drawing at the edge
+ // results in invisible lines. Unfortunately lines drawn at the edge of a
// user-supplied range will still be invisible. If logscale is
// set, add a variable amount of padding at the top but
// none at the bottom.
minAxisY = minY - ypad * span;
// Backwards-compatible behavior: Move the span to start or end at zero if it's
- // close to zero, but not if avoidMinZero is set.
- if (!this.getBooleanOption("avoidMinZero")) {
- if (minAxisY < 0 && minY >= 0) minAxisY = 0;
- if (maxAxisY > 0 && maxY <= 0) maxAxisY = 0;
- }
+ // close to zero.
+ if (minAxisY < 0 && minY >= 0) minAxisY = 0;
+ if (maxAxisY > 0 && maxY <= 0) maxAxisY = 0;
}
}
axis.extremeRange = [minAxisY, maxAxisY];
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <link rel="stylesheet" href="../css/dygraph.css">
- <title>dygraph</title>
- <!--
- For production (minified) code, use:
- <script type="text/javascript" src="dygraph-combined.js"></script>
- -->
- <script type="text/javascript" src="../dist/dygraph.js"></script>
-
- </head>
- <body>
- <p>1: Line chart with axis at zero problem:</p>
- <div id="graph1"></div>
- <script type="text/javascript">
- var g1 = new Dygraph(document.getElementById("graph1"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n"
- )
- </script>
-
- <p>2: Step chart with axis at zero problem:</p>
- <div id="graphd2"></div>
- <script type="text/javascript">
- var g2 = new Dygraph(document.getElementById("graphd2"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- stepPlot: true
- }
- )
- </script>
-
- <p>3: Line chart with <code>avoidMinZero</code> option:</p>
- <div id="graph3"></div>
- <script type="text/javascript">
- var g3 = new Dygraph(document.getElementById("graph3"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- avoidMinZero: true
- }
- )
- </script>
-
- <p>4: Step chart with <code>avoidMinZero</code> option:</p>
- <div id="graphd4"></div>
- <script type="text/javascript">
- var g4 = new Dygraph(document.getElementById("graphd4"),
- "Date,Temperature\n" +
- "2008-05-07,0\n" +
- "2008-05-08,1\n" +
- "2008-05-09,0\n" +
- "2008-05-10,0\n" +
- "2008-05-11,3\n" +
- "2008-05-12,4\n",
- {
- stepPlot: true,
- avoidMinZero: true
- }
- )
- </script>
-
- </body>
-</html>