以比屏幕更高的 DPI 创建画布对象?

发布于 2024-09-07 21:26:10 字数 152 浏览 7 评论 0原文

我有一个画布对象,我需要能够以比本机屏幕分辨率更高的分辨率创建该对象。我正在使用 Flot 图形库,并且需要输出一个打印时与屏幕上显示时一样好的图形。

我能想到的唯一方法是将画布尺寸放大 3 倍,然后缩放,但我认为当我去打印时这不能正常工作。

有什么想法吗?

I've got a canvas object that I need to be able to create at a higher resolution than what native screen resolution is. I'm using the Flot graphs library, and I'd need to output a graph that looks just as good when it's printed as when it's displayed on screen.

The only method I can think of is making the canvas size 3x larger, then scaling, but I don't think that'd work properly when I go to print.

Any ideas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

情域 2024-09-14 21:26:10

因此,您建议您创建一个具有特定宽度和高度(它是本机分辨率)的画布元素,并将其缩放到不同的窗口坐标,例如:

<canvas width="320" height="240" style="width: 640px; height: 480px"></canvas>

我认为这样做的一个问题是打印渲染器可能会将缩放的画布视为图像并以文档像素分辨率渲染它,因此您可能无法获得所需的改进。

对于您想要的内容,可能值得了解是否可以使用 SVG。

So you are suggesting that you create a canvas element with a particular width and height (it's native resolution) and scale it to different window coordinates, e.g.:

<canvas width="320" height="240" style="width: 640px; height: 480px"></canvas>

I think a problem with doing this would be that the print renderer may treat the scaled canvas like an image and just render it at document pixel resolution, so you might not get the improvement you want.

For what you want it might be worth finding out if you could use SVG.

我喜欢麦丽素 2024-09-14 21:26:10

结束这个循环 - 我发现最好的选择是以 2 倍分辨率创建一个画布对象,然后使用宽度和高度 CSS 参数对其进行缩放。

Closing the loop on this one - I've found the best option is to create a canvas object at 2x resolution, then scale it using width and height CSS parameters.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文