Resize underlying canvas size according to `markerArea.renderWidth` and `markerArea.renderHeight` resolution (same as the image natural dimensions)

[Himujjal]

For a certain implementation, I need to get the rendered final annotated image with a size that matches the resolution of the image rather than the resolution of the img.height and img.width.

Currently, the annotations work wrt to the size of the image in the DOM and not its natural dimensions.

I have tried using renderAtNaturalSize and renderWidth/renderHeight. It doesn't work.

Rendered Image:

Desired Image:

[ailon]

Please elaborate on what you mean by renderAtNaturalSize doesn't work. Because it does work, as far as I can tell :)

Also, I'm not sure I understand the question/statement in the title. If you mean you want to create annotations at the natural image size rather than how it's displayed on your page, then I guess you have an option of creating a copy of your image in desired dimensions and then open marker.js on that.

[Himujjal]

Is it not possible to create annotations at the natural image size without having a copy in desired dimensions? This image that I am displaying is created using renderState and read-only from the original image.

I think many would love to have this feature.

[ailon]

As I mentioned, could you please elaborate or rephrase what you are trying to do and what isn't working. To be honest, I don't really grasp the problem.

Here's a quick demo of rendering at natural size that works perfectly fine for me: https://codesandbox.io/s/marker-js-2-render-at-natural-size-wcgl37