Canvas pattern offset

Question

I\'m trying to modify the origin of canvas pattern but can\'t achieve quite what I want.

I need to draw a line filled with a dotted pattern. Dotted pattern is create

Answer 1

You can simply translate the context after drawing the line/shape & before stroking/filling to offset the pattern. Updated fiddle http://jsfiddle.net/28BSH/27/

ctx.fillStyle = somePattern;
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(180, 180);
ctx.save();
ctx.translate(offset, offset);
ctx.stroke();
ctx.restore();