将呈现的HTML保存为图像

Question

我正在构建一个需要将div导出到图像的web应用程序。该div将包含图像，其他div，用css样式的文本等等。最后，用户应该有一张图像，看起来就像他截取了该div的截图一样。我查看了服务器端的php库，但是我没有看到任何能够处理呈现的HTML复杂性的东西。 HTML5画布具有该功能，但我无法为我的情况使用画布。有任何想法吗？

谢谢！

Answer 1

您可以将div标记为canvas标记，直接访问像素数据，将其发送到PHP脚本并使用数据构建图像。

这里是你如何获得的像素数据 https://developer.mozilla.org/en/html/canvas/pixel_manipulation_with_canvas

这里就是你会用什么用像素 http://php.net/manual/en/function.imagesetpixel.php

Answer 2

我已经写了与CSS样式的画布转换HTML的一个项目创建了图像的像素。

它可以在这里找到：https://github.com/coolbloke1324/html-to-canvas

和实例测试页，请访问：http://www.isogenicengine.com/html-canvas/test/index.html

在测试页，初始加载只会显示一个正方形的DIV，里面坐了一些其他的div各种像背景和包括边框半径在内的边框等风格。您会在页面右上方看到一个标记为“渲染”的按钮。点击该按钮，画布将被创建，然后DOM将被解析并呈现到画布上。我故意将画布的背景颜色更改为黑色，以便您可以看到差异。

Answer 3

退房html2canvas。在canvas元素上呈现页面内容的JavaScript框架。