makeImage is cropping the image

GoJS
#1

Hi I have used following code to download my diagram as Image, but it is giving partial image of partial diagram and not the full diagram.
Can you please guide me where am i going wrong.

const filename = 'newImage.png';
const aTag = document.createElement('a');
const imageData = diagram.makeImage({
    scale: 1,
    type: 'image/png',
    background: 'white',
});
aTag.setAttribute('href', imageData.src);
aTag.setAttribute('download', filename);
aTag.style.display = 'none';
document.body.appendChild(aTag);
aTag.click();
document.body.removeChild(aTag);
#2

What are the dimensions of the image you have downloaded?

Note in the documentation, https://gojs.net/latest/api/symbols/Diagram.html#makeImageData, that there is a default maximum size of 2000x2000. You can increase that if you want. For example:

      const imageData = diagram.makeImage({
          scale: NaN,
          maxSize: new go.Size(3000, 3000),
          type: 'image/png',
          background: 'white',
      });
#3

Is there a way to give size Infinity, or the actually size of Diagram.
So that diagram is not cropped.
I can not give maxSize to 3000 or 5000 as it may me more than that in some cases.
In-fact we cannot guess the maxSize for it

#4

As the documentation states, setting scale: NaN will cause the scale to be computed so that it fits in whatever maxSize you specify, if it’s bigger. But if it’s smaller, then that’s fine.

When I tried the code that I quoted above, it worked well.

#5

If I give scale=NaN then the image quality is very poor
Not at all readable

#6

What are you using for the maxSize? How large is the Diagram.documentBounds?

#7

I have not set any maxSize

Diagram.documentBounds for the one I have tested is
width: 9876.75, height: 9301.501999999995,
for other diagrams it might be more or less.

#8

And it sounds as if you want to increase it, because when the height is about 9300, the rendering has been scaled down to 2000/9300.

If you really want to have only a single image, then you need to make the tradeoff for your app how big an image you can afford to render and how big your users would want them to be. For example, a 10000x10000 image would require about 400MB in memory.

#9

Ohhh Will discuss with my team and get back to you…

#10

Mean while, a 10000x10000 svg would also require about 400MB in memory or will take less?

#11

That depends on how complicated the rendering is. In general we recommend using SVG if the diagram might become large. But sometimes you have to have a raster image. Depends on the app’s requirements.