在 JavaScript (GIF/PNG) 中创建 DIV 的图像

IT技术 javascript image
2021-03-05 07:17:38

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

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

我最终想做的是将 DIV 内容编码为 PNG 格式,并使用打印操作发布编码数据。

如果可能的话,有什么想法吗?

[编辑] 我拥有的是一个地图应用程序,其中背景数据从图像服务器直接进入浏览器 DIV(想想谷歌地图)。该 div 是我主要数据的背景。当按下 Print 时,服务器根据它知道的数据生成一个 PDF,但对浏览器的背景数据一无所知。我真正想要的是能够以某种方式为服务器提供浏览器的背景图像!

干杯,罗

6个回答

也许有可能Canvas

MDN - 用画布绘制图形

您可以从 JavaScript 创建图像标签,但不能创建其中的实际图像:JS 没有为位图分配内存的命令,也没有在其上渲染任何内容的命令。

通常的解决方案是在服务器上安装一个报告生成器,根据请求创建图像。看看BIRTJasperReports

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

是的,如果打印引擎支持,Canvas 也应该可以工作。
2021-04-21 07:17:38
不是有新的“画布”吗?我想你可以用它画东西吗?
2021-04-28 07:17:38
没错,这就是其他事情的工作方式......我拥有的是一个地图应用程序,其中背景数据从图像服务器直接进入浏览器 DIV(想想谷歌地图)。该 div 是我主要数据的背景。当按下 Print 时,服务器根据它知道的数据生成一个 PDF,但对浏览器的背景数据一无所知。我真正想要的是能够以某种方式为服务器提供浏览器的背景图像!
2021-05-03 07:17:38

很有趣的问题。

实际上我使用ajax解决了这个问题(将图像的位置传输到服务器,服务器从碎片中创建一个图像,保存它并将url发送到客户端)。我不太喜欢这个解决方案,但我还不知道其他的。

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

您能否向 Web 服务器发送一些坐标信息或其他信息,然后让 Web 服务器从图像服务器请求相同的地图图像?

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