heightmapper icon indicating copy to clipboard operation
heightmapper copied to clipboard

Render not completing in Chrome when multiplier too high

Open lcoppa opened this issue 2 years ago • 0 comments

In main.js from line 447. When user selects high render multiplier => outputX, outputY are too large =>the resulting canvas doesn't work => the blob is null => no image gets saved. No error is raised to the user. The current limits for max canvas total pixels seem to be https://stackoverflow.com/questions/6081483/maximum-size-of-a-canvas-element. There should be a warning to the user or a max render multiplier depending on the browser.

main.js line 447:

// Stitch the image together
const renderCanvas = document.createElement('canvas');
renderCanvas.id = "renderCanvas";
renderCanvas.width = outputX;
renderCanvas.height = outputY;
const renderContext = renderCanvas.getContext("2d");

for(let i = 0; i < captures.length; i++) {
  const xPixel = captureOrigins[i].x * zoomFactor;
  const yPixel = captureOrigins[i].y * zoomFactor;
  await addImageToCanvas(renderContext, captures[i], xPixel, yPixel);
  console.log("added image to canvas");
}

logRenderStep("Saving render");
const blob = await getCanvasBlob(renderCanvas);
saveAs(blob, `${renderName.name ?? 'render'}.png`);

lcoppa avatar Feb 12 '24 17:02 lcoppa