fix: 修复双图合并预览/导出为白图的问题
根因:renderOne 里 resolve(cvs) 后立即 chart.dispose(),Promise 微任务在 dispose 之后才执行,此时 echarts 已清空 canvas 内容,合并出来全是白图。 默认主题下因白底白图不易察觉(内容其实一直没画上)。 修复:resolve 前先把内容复制到独立 canvas 副本再 dispose,保证合并时 拿到的是有效像素。深色主题下验证通过(深色背景+彩色内容均正常)。
This commit is contained in:
@@ -941,11 +941,18 @@ function generateCombine() {
|
||||
const chart = echarts.init(holder, null, { renderer: 'canvas' });
|
||||
chart.setOption(option);
|
||||
setTimeout(() => {
|
||||
const cvs = holder.querySelector('canvas');
|
||||
if (!cvs) { reject(new Error('子图渲染失败')); return; }
|
||||
resolve(cvs);
|
||||
const srcCvs = holder.querySelector('canvas');
|
||||
if (!srcCvs) { reject(new Error('子图渲染失败')); return; }
|
||||
// 关键:先把内容复制到独立 canvas 再 dispose。
|
||||
// 直接 resolve 原 canvas 的话,Promise 微任务在 chart.dispose() 之后才执行,
|
||||
// 此时 canvas 内容已被 echarts 清空,合并出来就是白图。
|
||||
const copy = document.createElement('canvas');
|
||||
copy.width = srcCvs.width;
|
||||
copy.height = srcCvs.height;
|
||||
copy.getContext('2d').drawImage(srcCvs, 0, 0);
|
||||
chart.dispose();
|
||||
holder.remove();
|
||||
resolve(copy);
|
||||
}, 80);
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user