 <p>You may want to draw a white rectangle the size of the entire canvas, beneath the actual content of the canvas.</p> <pre><code>// get the canvas 2d context var ctx = canvas.getContext('2d'); // set the ctx to draw beneath your current content ctx.globalCompositeOperation = 'destination-over'; // set the fill color to white ctx.fillStyle = 'white'; // apply fill starting from point (0,0) to point (canvas.width,canvas.height) // these two points are the top left and the bottom right of the canvas ctx.fillRect(0, 0, canvas.width, canvas.height); </code></pre> <p>You have to apply these lines before generating your toDataUrl() stream.</p> <p>Idea taken from: <a href="http://www.mikechambers.com/blog/2011/01/31/setting-the-background-color-when-generating-images-from-canvas-todataurl/" rel="nofollow">http://www.mikechambers.com/blog/2011/01/31/setting-the-background-color-when-generating-images-from-canvas-todataurl/</a></p>