Skip to content

Render not completing in Chrome when multiplier too high #51

@lcoppa

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

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions