html5打印图片,以正确的大小打印 HTML5 Canvas_canvas_开发99编程知识库

部分 1: 生成 50mm 打印图形需要多少个画布像素？

打印机通常以 300像素每英寸打印。

以毫米为单位：300度/25.4 毫米，每毫米为 11.81像素。

如果要打印 50mm 绘图，则需要计算所需像素大小，如下所示：

50mm x 11.81 ppm = 590.5像素( 591像素)

调整画布大小，使它的具有 591像素( 假设方形)，如下所示：//resize the canvas to have enough pixels to print 50mm drawing

c.width=591;

c.height=591;

部分 2: 将画布导出为图像

要打印画布，你需要将画布转换成你可以使用 context.toDataURL 处理的图像。//create an image from the canvas

var img50mm=new Image();

img50mm.src=canvas.toDataURL();

部分 3: 将导出的图像转换为正确的打印分辨率

context.toDataURL 总是创建每英寸 72像素的图像。

打印机通常以高分辨率打印，可能每英寸 300像素。

因此，要使导出图像在页面上正确打印，导出的图像必须从 72ppi 转换为 300 ppi 。

这是一个服务器端工具，因这里你必须从服务器( 可能使用AJAX来往返你的形象) 中弹出导出的图像。

ImageMagick在 PHP 。IIS和其他服务器环境中工作。

下面是一个使用PHP转换图像分辨率和将转换图像转换回调用方的示例：//Assume you've uploaded the exported image to

//"uploadedImage.png" on the server

$magic = new Imagick();

$magic->setImageUnits(imagick::RESOLUTION_PIXELSPERINCH);

$im->setImageResolution(300,300);

$im->readImage("uploadedImage.png");

$im->setImageFormat("png");

header("Content-Type: image/png");

echo $im;

?>

部分：打印 ！

从服务器接收到的转换后的文件将在 300ppi 打印机上打印 50mm 方图像。