如何在html2canvas中将透明颜色变成白色而不是黑色? [英] How to make transparent color white instead of black in html2canvas?

问题描述

我正在尝试使用html2canvas截屏:

I'm trying to take a screenshot using html2canvas:

var body = document.getElementById("body")
$(body).html2canvas({onrendered: function( canvas ) {  
     var urlData = canvas.toDataURL("image/jpeg");  
}});

我的身体背景是透明的，因此由于jpeg而导致的urlData具有黑色背景(而不是浏览器中的白色).
在这种情况下，如何解决此问题并使背景颜色变为白色?

My body's background is transparent, and therefore urlData because of jpeg has black background (not white like in browser).
How can I fix this behavior and make background color white in this case?

推荐答案

我修改了临时文件:_html2canvas.Util.isTransparent from

I modified temporary: _html2canvas.Util.isTransparent from

_html2canvas.Util.isTransparent = function(backgroundColor) {
  return (backgroundColor === "transparent" || backgroundColor === "rgba(0, 0, 0, 0)");
};

到

_html2canvas.Util.isTransparent = function(backgroundColor) { return (backgroundColor === "transparent" || backgroundColor === "rgba(0, 0, 0, 0)" || backgroundColor === undefined); };

_html2canvas.Util.isTransparent = function(backgroundColor) { return (backgroundColor === "transparent" || backgroundColor === "rgba(0, 0, 0, 0)" || backgroundColor === undefined); };

之后，只要调用设置了背景参数的html2canvas就可以了:

and after that it was enough to call html2canvas with background parameter set:

html2canvas(screenshot_element, {
    background :'#FFFFFF',
    onrendered: function (canvas) {
      .....
    }
  });

对我来说...考虑透明的未定义背景是有道理的.

For me... it makes sense to consider transparent a background that is undefined.

这篇关于如何在html2canvas中将透明颜色变成白色而不是黑色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！