Add drawAxis option, deprecating drawXAxis and drawYAxis. Added tests for that and...
[dygraphs.git] / auto_tests / tests / to_dom_coords.js
CommitLineData
063e83ba
DV
1/**
2 * @fileoverview Test cases for toDomCoords/toDataCoords
3 *
4 * @author danvk@google.com (Dan Vanderkam)
5 */
6
7var ToDomCoordsTestCase = TestCase("to-dom-coords");
8
4707563c 9ToDomCoordsTestCase._origFunc = Dygraph.getContext;
063e83ba
DV
10ToDomCoordsTestCase.prototype.setUp = function() {
11 document.body.innerHTML = "<div id='graph'></div>";
12 Dygraph.getContext = function(canvas) {
4707563c 13 return new Proxy(ToDomCoordsTestCase._origFunc(canvas));
063e83ba
DV
14 }
15};
16
17ToDomCoordsTestCase.prototype.tearDown = function() {
4707563c 18 Dygraph.getContext = ToDomCoordsTestCase._origFunc;
063e83ba
DV
19};
20
21// Checks that toDomCoords and toDataCoords are inverses of one another.
22ToDomCoordsTestCase.prototype.checkForInverses = function(g) {
23 var x_range = g.xAxisRange();
24 var y_range = g.yAxisRange();
25 for (var i = 0; i <= 10; i++) {
26 var x = x_range[0] + i / 10.0 * (x_range[1] - x_range[0]);
27 for (var j = 0; j <= 10; j++) {
28 var y = y_range[0] + j / 10.0 * (y_range[1] - y_range[0]);
29 assertEquals(x, g.toDataXCoord(g.toDomXCoord(x)));
30 assertEquals(y, g.toDataYCoord(g.toDomYCoord(y)));
31 }
32 }
33}
34
35ToDomCoordsTestCase.prototype.testPlainChart = function() {
36 var opts = {
7f6a7190
RK
37 axes : {
38 x : {
39 drawAxis : false,
40 drawGrid : false,
41 },
42 y : {
43 drawAxis : false,
44 drawGrid : false,
45 }
46 },
063e83ba
DV
47 rightGap: 0,
48 valueRange: [0, 100],
49 dateWindow: [0, 100],
50 width: 400,
51 height: 400,
52 colors: ['#ff0000']
53 }
54
55 var graph = document.getElementById("graph");
56 g = new Dygraph(graph, [ [0,0], [100,100] ], opts);
57
58 assertEquals([0, 100], g.toDataCoords(0, 0));
59 assertEquals([0, 0], g.toDataCoords(0, 400));
60 assertEquals([100, 100], g.toDataCoords(400, 0));
61 assertEquals([100, 0], g.toDataCoords(400, 400));
62
63 this.checkForInverses(g);
64
796ccbc0 65 // TODO(konigsberg): This doesn't really belong here. Move to its own test.
063e83ba
DV
66 var htx = g.hidden_ctx_;
67 assertEquals(1, CanvasAssertions.numLinesDrawn(htx, '#ff0000'));
68}
69
70ToDomCoordsTestCase.prototype.testChartWithAxes = function() {
71 var opts = {
72 drawXAxis: true,
73 xAxisHeight: 50,
74 drawYAxis: true,
75 yAxisLabelWidth: 100,
76 axisTickSize: 0,
77 drawXGrid: false,
78 drawYGrid: false,
79 rightGap: 0,
80 valueRange: [0, 100],
81 dateWindow: [0, 100],
82 width: 500,
83 height: 450,
84 colors: ['#ff0000']
85 }
86
87 var graph = document.getElementById("graph");
88 g = new Dygraph(graph, [ [0,0], [100,100] ], opts);
89
90 assertEquals([0, 100], g.toDataCoords(100, 0));
91 assertEquals([0, 0], g.toDataCoords(100, 400));
92 assertEquals([100, 100], g.toDataCoords(500, 0));
93 assertEquals([100, 0], g.toDataCoords(500, 400));
94
95 this.checkForInverses(g);
96}
97
98ToDomCoordsTestCase.prototype.testChartWithAxesAndLabels = function() {
99 var opts = {
100 drawXAxis: true,
101 xAxisHeight: 50,
102 drawYAxis: true,
103 yAxisLabelWidth: 100,
104 axisTickSize: 0,
105 drawXGrid: false,
106 drawYGrid: false,
107 rightGap: 0,
108 valueRange: [0, 100],
109 dateWindow: [0, 100],
110 width: 500,
111 height: 500,
112 colors: ['#ff0000'],
113 ylabel: 'This is the y-axis',
114 xlabel: 'This is the x-axis',
115 xLabelHeight: 25,
116 title: 'This is the title of the chart',
117 titleHeight: 25
118 }
119
120 var graph = document.getElementById("graph");
121 g = new Dygraph(graph, [ [0,0], [100,100] ], opts);
122
123 assertEquals([0, 100], g.toDataCoords(100, 25));
124 assertEquals([0, 0], g.toDataCoords(100, 425));
125 assertEquals([100, 100], g.toDataCoords(500, 25));
126 assertEquals([100, 0], g.toDataCoords(500, 425));
127
128 this.checkForInverses(g);
129}
efd5b117
RK
130
131ToDomCoordsTestCase.prototype.testYAxisLabelWidth = function() {
132 var opts = {
133 yAxisLabelWidth: 100,
134 axisTickSize: 0,
135 rightGap: 0,
136 valueRange: [0, 100],
137 dateWindow: [0, 100],
138 width: 500,
268e525d 139 height: 500
efd5b117
RK
140 }
141
142 var graph = document.getElementById("graph");
143 g = new Dygraph(graph, [ [0,0], [100,100] ], opts);
144
145 assertEquals([100, 0], g.toDomCoords(0, 100));
268e525d 146 assertEquals([500, 486], g.toDomCoords(100, 0));
efd5b117
RK
147
148 g.updateOptions({ yAxisLabelWidth: 50 });
149 assertEquals([50, 0], g.toDomCoords(0, 100));
268e525d
RK
150 assertEquals([500, 486], g.toDomCoords(100, 0));
151}
152
153ToDomCoordsTestCase.prototype.testAxisTickSize = function() {
154 var opts = {
155 yAxisLabelWidth: 100,
156 axisTickSize: 0,
157 rightGap: 0,
158 valueRange: [0, 100],
159 dateWindow: [0, 100],
160 width: 500,
161 height: 500
162 }
163
164 var graph = document.getElementById("graph");
165 g = new Dygraph(graph, [ [0,0], [100,100] ], opts);
166
167 assertEquals([100, 0], g.toDomCoords(0, 100));
168 assertEquals([500, 486], g.toDomCoords(100, 0));
169
170 g.updateOptions({ axisTickSize : 50 });
171 assertEquals([200, 0], g.toDomCoords(0, 100));
172 assertEquals([500, 386], g.toDomCoords(100, 0));
efd5b117 173}
1f8c95d8 174
175ToDomCoordsTestCase.prototype.testChartLogarithmic = function() {
176 var opts = {
177 drawXAxis: false,
178 drawYAxis: false,
179 drawXGrid: false,
180 drawYGrid: false,
181 logscale: true,
182 rightGap: 0,
c8e01863
DV
183 valueRange: [1, 4],
184 dateWindow: [0, 10],
1f8c95d8 185 width: 400,
186 height: 400,
187 colors: ['#ff0000']
188 }
189
190 var graph = document.getElementById("graph");
c8e01863
DV
191 g = new Dygraph(graph, [ [1,1], [4,4] ], opts);
192
193 var epsilon = 1e-8;
194 assertEqualsDelta([0, 4], g.toDataCoords(0, 0), epsilon);
195 assertEqualsDelta([0, 1], g.toDataCoords(0, 400), epsilon);
196 assertEqualsDelta([10, 4], g.toDataCoords(400, 0), epsilon);
197 assertEqualsDelta([10, 1], g.toDataCoords(400, 400), epsilon);
198 assertEqualsDelta([10, 2], g.toDataCoords(400, 200), epsilon);
1f8c95d8 199
c8e01863
DV
200 assertEquals([0, 0], g.toDomCoords(0, 4));
201 assertEquals([0, 400], g.toDomCoords(0, 1));
202 assertEquals([400, 0], g.toDomCoords(10, 4));
203 assertEquals([400, 400], g.toDomCoords(10, 1));
204 assertEquals([400, 200], g.toDomCoords(10, 2));
1f8c95d8 205}