问题标签 [html2canvas]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
963 浏览

jquery-ui - html2canvas 对 DIV 元素进行截图?

我正在尝试制作 div 元素屏幕截图,但与可拖动的 jQuery 结合使用,但没有运气,我可以截取 div 的屏幕截图并将其保存为 png,但是如果我在该 div 上拖动一些元素然后保存屏幕截图,我只会得到什么在那个 div 里面和那个 div 上的可拖动元素?任何想法,到目前为止这个我的代码

我正在使用 AJAX 保存图像并呈现在新元素中

AJAX.PHP

这是HTML:

0 投票
1 回答
824 浏览

java - 将图像打印成 pdf 文件

当用户使用我的应用程序进行进一步使用时,他必须拍摄应用程序的屏幕截图。当我单击按钮时,需要拍摄应用程序屏幕截图并将其存储在 png 或 pdf 文件中。谁能告诉我从哪里开始。我看了很多..但我没有得到任何合适的样本。我尝试使用http://html2canvas.hertzen.com/ 但未能从听到开始。

非常感谢您的帮助..

0 投票
1 回答
2302 浏览

javascript - 将图像存储到 png 文件中

我想使用 javascript 将网页存储到 png 文件中。我厌倦了下面的示例代码。但问题是当我下载它的下载扩展名时,image/octet-stream但在下载文件期间我想以 png 格式存储图像。如何从 image/octet-stream 扩展名下载图像到 png 扩展名。代码:

0 投票
1 回答
6468 浏览

javascript - 将谷歌地图保存为图像 - 使用 javascript(能够截取屏幕截图)

我参考了以下 SO 问题来使用 javascript (html2canvas) 捕获谷歌地图的屏幕截图。feedback.js截屏-使用-html2canvas创建-截屏捕获-div-into-imagehtml2canvas-github

我使用静态地图来获取图像,但我有接近 150 个标记,并且 URL 的总长度超出了 2048 个字符的限制。

我能够使用 javascript 中的事件侦听器捕获屏幕截图。我用来捕获图像的代码如下。我尝试使用window.save,但在html2canvas.js 中没有这样的方法。关于如何将图像保存到本地文件系统的任何建议?

事件监听器:

0 投票
1 回答
1653 浏览

javascript - 无法将 html2canvas 与 ie8 一起使用

我想将 html2canvas 与 ie8 一起使用。我已经搜索并发现使用 html2canvas 的 flashcanvas。但是,我在文件 html2canvas.js 中有一个问题。每次调用函数 loadPseudoElement 时:

“var style = window.getComputedStyle(element, type)”行中出现错误。

显然,getComputedStyle 不是由 ie8 处理的。我试过这个:

但它仍然无法正常工作。

我调用 html2canvas 和 flashcanvas 的 JS 代码是:

请问你能帮帮我吗?

谢谢你。

0 投票
0 回答
656 浏览

android - 带有phonegap错误的html2canvas

得到错误

在使用 phonegap 将 html div 内容转换为 android 中的画布时。

它在浏览器上正常工作。任何帮助将不胜感激。我正在使用 jQuery-1.9.1,jQuery-UI。

代码片段:

// html文件

// 脚本

0 投票
0 回答
1482 浏览

javascript - html2canvas,读取 facebook 图片的代理

我正在尝试使用 html2canvas 从包含一些图像的 div 呈现 img,它们可能来自或不来自 facebook 服务器,但我不知道如何为此目的使用代理选项。这是我的html代码和js代码:

JS:

然后我在页面上有这个带有“canvas_div”ID的div。

0 投票
0 回答
288 浏览

javascript - 如何缩放/放大 HTML 内容并将其保存为图像?

我有一个 JavaScript 产品设计器,它允许网页用户添加文本和图像以创建动态促销产品。设计阶段效果很好,我使用 html2canvas 将他们的定制产品变成图像。图像看起来很适合屏幕但不适合打印,这是最终目标。

如何放大 HTML 内容(保留细节)并将结果另存为图像 (png)?

在将网络内容放在画布上之后,我已经成功地缩放了图像,但这显然会丢失细节。

在将内容应用到画布之前,我已经使用 CSS3“转换”属性来缩放我的图像。这样可以很好地保留细节和比例。但是, html2canvas 会忽略该 CSS 并导出原始大小(此处已确认:https ://github.com/niklasvh/html2canvas/issues/176 )

有人有这样做的经验吗?

0 投票
2 回答
17701 浏览

javascript - html2canvas,样式不适用于画布?

我正在编写用于处理图片并将其保存到图像的脚本。

我有一个 div,我在其中设置了背景图像,在该 div 中,我有另一个 div,其中包含我操纵的图像(调整大小、旋转和拖动)。一切正常,我收到图像,调整大小和位置样式正确应用,只有旋转样式恢复为零度角,即水平。有什么解决方法吗?

我的代码,

HTML:

CSS:

Javascript

0 投票
1 回答
2443 浏览

javascript - html2canvas,一种捕捉 iframe 的方法?

我需要做一个 iframe 的快照,但是 html2canvass 不这样做,这是众所周知的。

我试图通过myiframe.contentWindow.document.body元素将 iframe 的内容传递给 html2canvas 函数,只有当我的页面和 iframe 内的页面都在同一个域中时(安全原因),这才有效,但这正是我所需要的。

但是现在问题来了....输出图像与预期的不太相似。按钮看起来像一个文本字段和其他奇怪的东西......一个例子:

原始页面的图像

在此处输入图像描述

这是来自 html2canvas、不同按钮和文本框的 png 结果,也没有背景。

在此处输入图像描述

我做错了吗?还是图像渲染器不完全相同是正常的?我只需要拍摄 iframe 的快照,如果您有其他方法可以做到这一点,我可以。