[Bug]: 设置背景颜色，但不能导出。用drawImage进行拷贝之后导出，导出无法显示拓补的图像数据

Describe the bug / 问题描述

拓补展示的 实际导出的

Reproduction link / 复现链接

No response

Steps to Reproduce the Bug or Issue / 重现步骤

1. 随便选取一个示例加上 plugins: [ { type: 'background', background: 'red' } ]
2. 导出 `const a = document.createElement('a') const graphDataUrl = await this.graph.toDataURL({ mode: 'overall' }) a.href = graphDataUrl a.download = 'graph.jpg' a.click()

` 会发现没有背景

1. 将dataUrl放在img加载，然后绘制在canvas，内容绘制不出 ` // 将DataURL转换为Canvas并添加背景颜色 function dataURLToCanvas(dataURL, backgroundColor = '#f0f2f5') { return new Promise((resolve, reject) => { // 创建Image对象 const img = new Image();

   // 设置图片加载完成后的回调 img.onload = function() { // 创建Canvas元素 const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d');

   // 设置Canvas尺寸与图片相同 canvas.width = img.width; canvas.height = img.height;

   // 第一步：填充背景颜色 ctx.fillStyle = backgroundColor; ctx.fillRect(0, 0, canvas.width, canvas.height);

   // 第二步：绘制图片（这会覆盖在背景之上） ctx.drawImage(img, 0, 0);

   // 返回Canvas元素 resolve(canvas); };

   // 设置图片加载失败的回调 img.onerror = function() { reject(new Error('Failed to load image from DataURL')); };

   // 将DataURL设置为图片源 img.src = dataURL; }); }

// 使用示例 async function convertAndAddBackground() { try { // 假设 dataURL 是你已有的DataURL const canvas = await dataURLToCanvas(dataURL, '#f0f2f5');

// 现在你可以使用这个Canvas做进一步操作
// 例如转换为其他格式或直接显示在页面上
document.body.appendChild(canvas);

// 或者转换为Blob进行下载
canvas.toBlob((blob) => {
  const url = URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href = url;
  a.download = 'image-with-background.png';
  a.click();
  URL.revokeObjectURL(url);
}, 'image/png');

} catch (error) { console.error('Error:', error); } } ` 4. 直接使用drawImage来拷贝拓补的canvas，也是空

Version / 版本

Please select / 请选择

OS / 操作系统

• macOS
• Windows
• Linux
• Others / 其他

Browser / 浏览器

• Chrome
• Edge
• Firefox
• Safari (Limited support / 有限支持)
• IE (Nonsupport / 不支持)
• Others / 其他