var x, y, i, ticks;
if (g.getOption('drawYGrid')) {
+ var axes = ["y","y2"];
+ var strokeStyles = [], lineWidths = [], drawGrid = [], stroking = [], strokePattern =[];
+ for(var index in axes){
+ drawGrid[index] = g.getOptionForAxis("drawGrid",axes[index]);
+ if(drawGrid[index]){
+ strokeStyles[index] = g.getOptionForAxis('gridLineColor',axes[index]);
+ lineWidths[index] = g.getOptionForAxis('gridLineWidth',axes[index]);
+ strokePattern[index] = g.getOptionForAxis('gridLinePattern',axes[index]);
+ stroking[index] = strokePattern[index] && (strokePattern[index].length >= 2);
+ }
+ }
ticks = layout.yticks;
ctx.save();
- ctx.strokeStyle = g.getOption('gridLineColor');
- ctx.lineWidth = g.getOption('gridLineWidth');
+ // draw grids for the differen axes
for (i = 0; i < ticks.length; i++) {
- // TODO(danvk): allow secondary axes to draw a grid, too.
- if (ticks[i][0] !== 0) continue;
- x = halfUp(area.x);
- y = halfDown(area.y + ticks[i][1] * area.h);
- ctx.beginPath();
- ctx.moveTo(x, y);
- ctx.lineTo(x + area.w, y);
- ctx.closePath();
- ctx.stroke();
+ var axis = ticks[i][0];
+ if(drawGrid[axis]){
+ if (stroking[axis]) {
+ ctx.installPattern(strokePattern[axis]);
+ }
+ ctx.strokeStyle = strokeStyles[axis];
+ ctx.lineWidth = lineWidths[axis];
+
+ x = halfUp(area.x);
+ y = halfDown(area.y + ticks[i][1] * area.h);
+ ctx.beginPath();
+ ctx.moveTo(x, y);
+ ctx.lineTo(x + area.w, y);
+ ctx.closePath();
+ ctx.stroke();
+
+ if (stroking[axis]) {
+ ctx.uninstallPattern();
+ }
+ }
}
ctx.restore();
}
- if (g.getOption('drawXGrid')) {
+ if (g.getOption('drawXGrid') && g.getOptionForAxis("drawGrid",'x')) {
ticks = layout.xticks;
ctx.save();
- ctx.strokeStyle = g.getOption('gridLineColor');
- ctx.lineWidth = g.getOption('gridLineWidth');
+ var strokePattern = g.getOptionForAxis('gridLinePattern','x');
+ var stroking = strokePattern && (strokePattern.length >= 2);
+ if (stroking) {
+ ctx.installPattern(strokePattern);
+ }
+ ctx.strokeStyle = g.getOptionForAxis('gridLineColor','x');
+ ctx.lineWidth = g.getOptionForAxis('gridLineWidth','x');
for (i = 0; i < ticks.length; i++) {
x = halfUp(area.x + ticks[i][0] * area.w);
y = halfDown(area.y + area.h);
ctx.closePath();
ctx.stroke();
}
+ if (stroking) {
+ ctx.uninstallPattern();
+ }
ctx.restore();
}
};