更高的DPI图形与HTML5画布 [英] Higher DPI graphics with HTML5 canvas
问题描述
在使用HTML5画布创建图像时，是否有设置自定义DPI / PPI的方法？我知道如何在画布上绘制并导出为图像，但如何确保输出图像是某些DPI / PPI。我想使用SVG elemnts在画布上绘制是一种方式，但是当我将整个画布作为图像导出时，不会被展平？或者计算设备DPI，然后缩放图像以满足我的DPI要求，但这似乎不是正确的解决方案。
Is there a way to set a custom DPI/PPI when creating an image using the HTML5 canvas? I know how can I draw on the canvas and export it as an image, but how can I make sure the output image is of certain DPI/PPI. I guess using SVG elemnts to draw on the canvas is a way, but wouldn't that be flattened out when I export the whole canvas as an image? Or calculating the device DPI and then scaling the image to meet my DPI requirement, but that doesn't seem like the correct solution.
推荐答案
p>您不能（ugh）在任何浏览器中访问当前网页的显示的DPI：
You cannot (ugh) access the DPI of a display of the current web page in any browser:
打印：您最有可能无法使用浏览器标准函数设置导出的< canvas> 图像（PNG，JPEG）的DPI。然而，如果你使用纯JavaScript编码器图像编码器，你可以自由地创建任何类型的二进制文件，你希望和手动调整嵌入的二进制的DPI值。
For printing: You most likely cannot set the DPI of exported <canvas> image (PNG, JPEG) using browser standard functions. However, if you use a pure Javascript encoder image encoder you are free to create any sort of binary file you wish and manually adjust the DPI value embedded int he binary.
https://gist.github.com/1245476
这篇关于更高的DPI图形与HTML5画布的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
