以编程方式从网页或单个DIV创建图像

Question

有没有办法以编程方式创建（客户端或服务器端（PHP））来自特定DIV或完整（Web）页面的图像？我目前正在创建一个免费优惠券的网站，想法是当最终用户点击“打印”按钮时，该应用程序会打开一个新的选项卡/窗口，其中包含所有选定的优惠券作为单个图像（JPG，PNG）等等。）A4格式准备打印。每张优惠券都有自己的数据（文章名称，价格，描述等）。所以我需要通过我设计的优惠券模板以编程方式完成。

我不要求你为我编写代码，只是建议一个我可以使用/开发的解决方案。如果还不存在，我将免费上传/发布它:)

更新：我使用PHP GD库完成了:)仍然不满意使用图像而不是PDF的想法，因为每个打印在不同的PC上产生不同的优惠券尺寸（图像）。这就是PDF可能是更好的解决方案的原因。您可以在demo.svikuponi.ba上查看/测试它 - 只需选择几张优惠券，然后点击上方的PRINTAJ按钮。

Answer 1

这是一种在客户端创建图像的好方法：http://smus.com/screen-capture-for-chrome-os

你可以使用这个并创建一个可以在webkit上很好地工作的Web应用程序（对于其他浏览器 - 我会看看JS polyfills）。

Answer 2

您无法确保从div创建图像，但是您可以使用其gd库在php中创建动态图像。 以下链接将有所帮助：

http://php.net/manual/en/function.imagecreate.php

http://phptutorial.info/learn/create_images/

Answer 3

有人提到html2canvas和/或jsfeedback吗？

它完全用javascript创建页面截图，然后你可以通过ajax发送到服务器..

显然，CSS支持缺少一些东西。

Answer 4

在php中，有很多与图像相关的函数，比如GD库中的imagettftext（） 有关详情，请查看http://php.net/manual/en/book.image.php 如果GD不够，你可以试试想象力

对于模板，您可以尝试在文件（图像）中创建一个真正的颜色句柄，并添加文本部分或其他各种效果和条形码等。

但在你的情况下，我建议动态PDF创建，因为它更好的格式而不是普通图像，pdf lib： http://www.fpdf.org/

Answer 5

您可以轻松获得令牌/凭证的背景图片，并使用一些php变量覆盖文本。

我相信也可以用php成像创建一个独特的条形码。

Answer 6

可以从网页上获得screenshot，但这非常麻烦。您需要启动一个webbrowser来呈现页面并从中获取屏幕截图。

通过解析一些规范并将其提供给几个GD或Imagick函数，您可能会更好。这种用途不那么通用，但更容易管理。