3 * Copyright 2012 Dan Vanderkam (danvdk@gmail.com)
4 * MIT-licensed (http://opensource.org/licenses/MIT)
7 Dygraph
.Plugins
.Grid
= (function() {
11 Current bits of jankiness:
19 * Draws the gridlines, i.e. the gray horizontal & vertical lines running the
20 * length of the chart.
24 var grid
= function() {
27 grid
.prototype.toString
= function() {
28 return "Gridline Plugin";
31 grid
.prototype.activate
= function(g
) {
33 willDrawChart
: this.willDrawChart
37 grid
.prototype.willDrawChart
= function(e
) {
38 // Draw the new X/Y grid
. Lines appear crisper when pixels are rounded to
39 // half-integers. This prevents them from drawing in two rows/cols.
41 var ctx
= e
.drawingContext
;
42 var layout
= g
.layout_
;
43 var area
= e
.dygraph
.plotter_
.area
;
45 function halfUp(x
) { return Math
.round(x
) + 0.5; }
46 function halfDown(y
){ return Math
.round(y
) - 0.5; }
49 if (g
.getOption('drawYGrid')) {
50 ticks
= layout
.yticks
;
52 ctx
.strokeStyle
= g
.getOption('gridLineColor');
53 ctx
.lineWidth
= g
.getOption('gridLineWidth');
54 for (i
= 0; i
< ticks
.length
; i
++) {
55 // TODO(danvk): allow secondary axes to draw a grid, too.
56 if (ticks
[i
][0] !== 0) continue;
58 y
= halfDown(area
.y
+ ticks
[i
][1] * area
.h
);
61 ctx
.lineTo(x
+ area
.w
, y
);
68 if (g
.getOption('drawXGrid')) {
69 ticks
= layout
.xticks
;
71 ctx
.strokeStyle
= g
.getOption('gridLineColor');
72 ctx
.lineWidth
= g
.getOption('gridLineWidth');
73 for (i
= 0; i
< ticks
.length
; i
++) {
74 x
= halfUp(area
.x
+ ticks
[i
][0] * area
.w
);
75 y
= halfDown(area
.y
+ area
.h
);
78 ctx
.lineTo(x
, area
.y
);
86 grid
.prototype.destroy
= function() {