本文介绍了如何在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中将透明颜色变成白色而不是黑色?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-12 14:26