williamngan/pts

Space larger than browser?

pikeas opened this issue · 2 comments

Is there a way to render a large format canvas/SVG suitable for later printing?

Canvas has an offscreen option, but there's no way to give it separate dimensions from the on-screen canvas.

For SVG, I tried <svg width="800" height="600" viewbox="0 0 8000 6000">, but the SVGSpace() constructor overrides both the viewport and the viewbox.

Hi @pikeas -- sorry about the late reply. We probably need a better solution for this in future (maybe using NodeCanvas), but for a quick hack, you can set the internal property _pixelScale to scale up the resolution after setup. For example:

Pts.quickStart(...); // or alternatively, space = new CanvasSpace(...).setup(...);
space._pixelScale = 5; // 5x larger

Try it here: https://ptsjs.org/demo/edit/?name=canvasspace.resize
Tip: You can right-click "Save Image..." on the canvas to verify the image resolution.

Hope this helps Thanks for reporting this.

v0.10.7 has implemented a pixelDensity option in setup().

If you need very large image, try this experiment node-canvas implementation here:
https://github.com/williamngan/node-pts-canvas

Closing this issue now. Please reopen if you encounter new issues. Thanks for taking the time to file this issue!