Html2canvas: 元素样式仅适用于html2canvas吗?

创建于 2015-10-19  ·  5评论  ·  资料来源: niklasvh/html2canvas

我在一些元素上使用了方便的data-html2canvas-ignore标签,但是Firefox给我带来了负边距元素的问题。 我希望能够为特定元素添加html2canvas-only样式标签,例如: data-html2canvas-style="margin-left: 0"

其他人有运气做这样的事情吗?

Question

最有用的评论

您可以修改将使用onclone选项呈现的文档内容(是原始文档的副本),例如:

html2canvas(document.body, {onclone: function(document) {
  document.querySelector('.something').style.marginLeft = 0;
}}).then(...)

所有5条评论

您可以修改将使用onclone选项呈现的文档内容(是原始文档的副本),例如:

html2canvas(document.body, {onclone: function(document) {
  document.querySelector('.something').style.marginLeft = 0;
}}).then(...)

谢谢尼克! 非常感谢您在该库中的工作。 这在文档中吗?

不,不幸的是没有。 目前在许多方面都非常缺乏文档...

我下载的图片没有正确的样式,因此我使用了计算机化样式到内联样式来通过将所有样式转换为内联css来正确呈现它。 但问题在于它正在影响原始的dom。 所以我想在onc​​lone函数中为克隆的元素执行此操作,但是它不起作用并且图像的样式不正确。 知道为什么会这样吗?

我尝试做同样的事情,这是实现它的方式,并且正确下载了所有样式:

const computedStyleToInlineStyle = require("computed-style-to-inline-style");

 html2canvas(document.querySelector(".someclass"), {onclone: function(document) {
     computedStyleToInlineStyle(document.querySelector(".someclass"), {
          recursive: true
      });
    }}).then(canvas => {
        const imgData = canvas.toDataURL('image/png');
        ...
    });
此页面是否有帮助?
0 / 5 - 0 等级