docs: function(x, y, legendItem) {
  				if (isNaN(boxWidth) || boxWidth <= 0) {
  					return;
  				}
  
  				// Set the ctx for the box
  				ctx.save();
  
  				var lineWidth = valueOrDefault(legendItem.lineWidth, lineDefault.borderWidth);
  				ctx.fillStyle = valueOrDefault(legendItem.fillStyle, defaultColor);
  				ctx.lineCap = valueOrDefault(legendItem.lineCap, lineDefault.borderCapStyle);
  				ctx.lineDashOffset = valueOrDefault(legendItem.lineDashOffset, lineDefault.borderDashOffset);
  				ctx.lineJoin = valueOrDefault(legendItem.lineJoin, lineDefault.borderJoinStyle);
  				ctx.lineWidth = lineWidth;
  				ctx.strokeStyle = valueOrDefault(legendItem.strokeStyle, defaultColor);
  
  				if (ctx.setLineDash) {
  					// IE 9 and 10 do not support line dash
  					ctx.setLineDash(valueOrDefault(legendItem.lineDash, lineDefault.borderDash));
  				}
  
  				if (opts.labels && opts.labels.usePointStyle) {
  					// Recalculate x and y for drawPoint() because its expecting
  					// x and y to be center of figure (instead of top left)
  					var radius = boxWidth * Math.SQRT2 / 2;
  					var centerX = x + boxWidth / 2;
  					var centerY = y + fontSize / 2;
  
  					// Draw pointStyle as legend symbol
  					helpers.canvas.drawPoint(ctx, legendItem.pointStyle, radius, centerX, centerY);
  				} else {
  					// Draw box as legend symbol
  					if (lineWidth !== 0) {
  						ctx.strokeRect(x, y, boxWidth, fontSize);
  					}
  					ctx.fillRect(x, y, boxWidth, fontSize);
  				}
  
  				ctx.restore();
  			}