动态图像创建

Question

是否可以将网页的某些部分转换为图像。可以说我有一个包含文本和图像的div。我想将整个div存储为服务器端的图像，以便我可以在下次使用该图像。

你能告诉我是否有任何jquery插件/ php扩展程序可以做到这一点。我刚刚发现了这个http://www.visionmasterdesigns.com/tutorial-convert-text-into-transparent-png-image-using-php/

但这只是将文本转换为png。但我想将其转换为图像。

提前致谢。

此致 〜沙菲

Answer 1

您可以使用浏览器引擎将页面渲染为图像，然后剪切页面中请求的部分。

我不知道是否有一个jquery或php扩展为你做，但你可以使用exec调用并使用例如CutyCapt来呈现页面，并使用图像处理扩展来裁剪它。我自己没有测试过软件，但这是一个开始。

Answer 2

“我有一个示例div，它暴露给用户修改它。它可以容纳两个图像和一些文本。他可以从我们提供的许多图像中选择图像。最后我想将它存储为一个大图像。 “

在这种情况下，客户端屏幕捕获是错误的方法。您应该允许在用户浏览器上合成图像（因为听起来您已完成此部分），但是然后让浏览器发回在服务器上重新创建图像*所需的信息，然后使用GD进行处理， ImageMagick或类似的东西。它会在很多方面变得更容易，更清洁，更快捷：）

*例如：

• imageid：7
• text：'blah'
• textcolour：#ffffff
• textsize：3
• textx：10
• texty：10

编辑：您可能也应该将引用的部分放入问题中，因为原始帖子中并不完全清楚。

Answer 3

你到底想要完成的是什么？

LOLcat风格的图片字幕？我会使用Gd2并直接修改图像。

简化的网页布局？缓存div的源代码可能更快。我还建议手动创建一些并比较生成的文件传输大小，我敢打赌几乎在所有情况下（原始HTML +图像）都小于（生成的图像）​​。

Answer 4

我很确定你不能在JavaScript / jQuery中这样做。不管怎么说都不是没有插件。

将文本存储为图像听起来有点奇怪。

Answer 5

您可以调查使用其中一项服务的可能性。他们中的大多数都做缩略图，沿着美味的用途。但是http://www.webshotspro.com/看起来可以完全满足。有没有办法可以使用他们的API获取屏幕截图，然后裁剪出你需要的位？这实际上取决于你关心捕捉它的原因/为什么。

Answer 6

绝对不要在客户端上做，即使有办法（js和canvas元素），你也要相信客户端（垃圾邮件发送者可以使用它来为你提供广告而不是你的部分截图），取决于客户的字体，颜色设置等。

正确的方法是在服务器上，调用命令行浏览器，以编程方式获取屏幕截图并关闭它（但这将是非常难以实现，在服务器上征税，以及什么当你在一个受欢迎的网站上清除缓存时，一切都可以立即重新渲染，并尝试将100多个浏览器实例安装到RAM ......）。

我会：

1. 考虑一下我是否真的需要这样做，以及是否有一个更好的解决方案来解决初始问题（你需要将网站的部分内容呈现为图像到底为什么？缓存那部分html会不会这样做？或者iframe ？）
2. 如果是，使用PHP支持的图形库（如GD），你必须自己合成绘图，也许有一些库可以在更高层次上完成（用文本填充布局区域）手动分割它等等......）

Answer 7

如果您决定渲染图像，则必须

1. 调用独立的Web浏览器或
2. 嵌入（X）HTML呈现引擎，或
3. 限制输入选项，以便您可以编写（大大简化的）自定义渲染器，或
4. 将工作委托给外部服务

所有这些都取决于服务器的操作系统，可用的软件以及您拥有的访问权限。

Windows上的

1. ：使用COM自动化调用IE; 在Linux上：请参阅http://www.chimeric.de/blog/2007/1018_automated_screenshots_using_bash_firefox_and_imagemagick

Windows上的

2. ：请参阅http://msdn.microsoft.com/en-us/library/system.windows.forms.webbrowser.aspx; 在Linux上，请参阅http://webkit.org/building/build.html或http://khtml2png.sourceforge.net/ 您可能还会考虑PHP-Qt或PHP-GTK绑定。

希望有所帮助。