我使用 ChartJS 并将它们保存在本地,将画布上的图表图像转换为数据 blob,然后保存。但是我无法设置我保存的任何画布图表的背景颜色,我只能保存没有背景颜色的图表,这让用户感到困惑。
到目前为止我尝试过的是:
但没有成功,图像是在没有背景的情况下正确下载的。
我在搜索并找到了一些主题:
但是,在所有工作结束时,无法为我找到解决方案。
我的 html 图表是:
<canvas id="divName"></canvas>
Run Code Online (Sandbox Code Playgroud)
用于保存图像的打字稿函数,使用 bytearray 创建一个新的 blob,图像的类型是:(该代码已尝试添加背景颜色)
saveimg(divName){
let canvas:any;
let style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.cssClass { background-color: "aquamarine"; }';
if(this.deviceValue != null) {
canvas = document.getElementById(this.deviceValue);
}
else {
canvas = document.getElementById(divName);
}
//SOLUTION that works BY Caleb Miller ***********
fillCanvasBackground(canvas, 'white');
function fillCanvasBackground(canvasc, color)
{
const context = canvasc.getContext('2d');
context.save();
context.globalCompositeOperation = …Run Code Online (Sandbox Code Playgroud)