Skip to content

Render not completing in Chrome when multiplier too high #51

Description

@lcoppa

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`);

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions