在JavaScript（GIF / PNG）中创建DIV的图像

Question

我想知道是否有可用的JavaScript库，该库可让我从DIV的内容生成图像。

基本上，这是某些服务器端打印代码所必需的，这些代码需要从浏览器中打印背景。

我最终想要做的是将DIV内容编码为PNG格式，并通过打印操作发布编码后的数据。

有什么想法可能吗？

[编辑]我所拥有的是一个映射应用程序，其中背景数据从图像服务器直接进入浏览器DIV（例如Google Maps）。 该div是我主要数据的背景。 按下“打印”后，服务器将从其知道的数据生成PDF，但对浏览器的背景数据一无所知。 我真正想要的是能够以某种方式为服务器提供浏览器的背景图片！

欢呼声，Ro

Answer 1

也许通过Canvas可能：

MDN-使用画布绘制图形

Answer 2

您可以从JavaScript创建图像标签，但不能从其中的实际图像创建图像：JS没有用于为位图分配内存的命令，也没有用于在其上呈现任何内容的命令。

通常的解决方案是在服务器上有一个报告生成器，该报告生成器可根据要求创建图像。 看一下BIRT或JasperReports 。

[编辑]根据您的评论，解决方案很简单：检查DIV，找到背景图像的URL，然后用IMG元素替换DIV。 将URL放入SRC属性中，然后打印。

Answer 3

非常有趣的问题。

实际上，我使用ajax解决了这个问题（将图像的位置传输到服务器，服务器从多个片段创建一个图像，保存并将其发送到客户端）。 我不太喜欢这种解决方案，但我还不了解。

Answer 4

我真的不认为这在浏览器上是不可能的，当然，如果没有某种插件的话，这是不可能的。

您能否将一些坐标信息或其他内容发送到Web服务器，然后让Web服务器从图像服务器请求相同的地图图像？

Answer 5

只能在IE5中生成图像:(然后由于安全原因，它被删除了。我仍然不见了。

Answer 6

我想我已经找到了一种方法。

1）当用户按下打印时，询问DIV
2）OpenLayers API正在生成该DIV上的图像
3）抓取每个图片的网址
4）抓住每个图像在屏幕上的位置
5）将屏幕位置转换为真实位置（我有此API）
6）作为打印的一部分，发送所有图像URL及其真实范围
7）允许服务器重新请求图像并将其绘制到适当的位置。

Answer 7

是否必须在浏览器端完成？ 我已经看到您可以在哪里进行服务器端调用，并且服务器响应上的MIME类型是图像类型。 我认为我想的示例是针对db中b64编码的jpeg的，但是过程应该是相同的。 响应将是您DIV中当前存在的数据。 对不起，如果我离基地远一点。