文章/答案/技术大牛

发布

社区首页 >问答首页 >Javascript html2canvas无法获得背景

问Javascript html2canvas无法获得背景
EN

Stack Overflow用户

提问于 2014-03-17 17:23:58

回答 1查看 6.3K关注 0票数 2

使用Javascript库html2canvas的一些问题。问题是，html2canvas正在获得具有透明(有时是白色)背景的"div2“，我希望在"div2”中包含身体背景(或这个div后面)。

<div id="div2" style="width: 150px; height: 50px;"></div>


html2canvas(document.getElementById("div2"), {
            onrendered: function(canvas) {
                var photostring = canvas.toDataURL("image/png");
                console.log(photostring);
            }
        });

javascript

css

html2canvas

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-04-13 23:59:06

从逻辑上讲，呈现是根据您选择的元素工作的。

因此不会得到背景，除非选择“父元素”或“根元素”。

我有两个解决办法：

1 -使用Javascript/Jquery，您可以从div#target捕获X和Y位置，然后按X/Y位置在div#target中设置背景图像和背景位置。

2 -使用html2canvas捕获<body>，然后使用canvas/javascript api从div#target中按X/Y位置和宽度/高度裁剪图像，参见示例：#242 (注释)注意:在这些变量中设置宽度/高度/x/y(参见示例)：

var targetDiv = $("#target");
var sourceX = targetDiv.position().left;/*X position from div#target*/
var sourceY = targetDiv.position().top;/*Y position from div#target*/
var sourceWidth = targetDiv.width();/*clientWidth/offsetWidth from div#target*/
var sourceHeight = targetDiv.height();/*clientHeight/offsetHeight from div#target*/

获取父/根元素中的背景图像：

https://github.com/niklasvh/html2canvas/commit/281e6bbedf9f611846eba3af4d256eb97f608aa2

作物画布：

https://github.com/niklasvh/html2canvas/issues/242#issuecomment-20875688

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/22461108

复制

相似问题

问Javascript html2canvas无法获得背景
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript html2canvas无法获得背景EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript html2canvas无法获得背景
EN