Heatmap truncated when zsmooth="fast"

[lvlte]

When the number of bricks to draw horizontally and/or vertically is larger than the computed imageWidth and/or imageHeight (respectively), then the heatmap is not rendered correctly, it is truncated somehow (actually the image being drawn has the proper dimensions but there are dead pixels), see for example this pen.

While this is an edge case, after investigation I found a bug in the code responsible for drawing bricks on the canvas. In fact, this bug affects performance (ie. drawing dead pixels outside the canvas), and when the conditions are met (ie. high-res heatmaps rendered in a smaller area), can lead to the issue described above.

So, when zsmooth="fast", the canvas is set to have dimensions n*m :

if(zsmooth === 'fast') {
	canvasW = n;
	canvasH = m;
} else {
	canvasW = imageWidth;
	canvasH = imageHeight;
}

The issue is that the pixel array which is used for both zsmooth best|fast is not set properly as it should be specific to these dimensions, instead it always assume imageWidth * imageHeight :

if(zsmooth) { // best or fast, works fastest with imageData
	var pxIndex = 0;
	var pixels;

	try {
		pixels = new Uint8Array(imageWidth * imageHeight * 4);
	} catch(e) {
		pixels = new Array(imageWidth * imageHeight * 4);
	}

Same here when creating imageData.

And in the for loop that fills the pixel array, imageWidth is used instead of n.