title: Changing Pattern Size in Html5 Canvas
body: <p><strong>My Problem:</strong> I've got an ImageObject, that is being used to create a PatternObject. My problem is, that i changed the <code>width</code> and <code>height</code> properties of the Image before creating the pattern, but that doesn't actually remap the image (and that is also no problem). The thing is, that I now have got a pattern, that is of a different size (the original image size) than the image itself. If I want to draw a line with the fillStyle of that pattern, it doesn't fit (because I need a pattern of the new size).</p>
  
  <p><strong>My question:</strong> Is there an easy way, to achieve that the pattern's width and height can be adjusted?</p>
  
  <p><strong><em>My tries</strong> and why I dont like them:</em></p>
  
  <p>1) Render the original image to a canvas with the new size and create the pattern from that. Didn't use this, because the pattern cannot be loaded directly as a result of the canvas being created and rendered to too slowly. But I want that pattern directly</p>
  
  <p>2) Calculate the variance between the new image size and the original one, change the lineWidth of the context, so the patterns height fits exactly and scale the line down, so it has a nice size. Didn't use that because I render in realtime and this is way too slow to be used later in webapps.</p>