fix: 画布尺寸 — 多slide用容器rect,单slide用canvas

- PPT设计稿(多slide):用容器rect,每页独立尺寸
- 网页(单slide):用canvas尺寸,确保内容不溢出
This commit is contained in:
李进
2026-07-27 12:00:07 +08:00
parent 5035647c91
commit f3d60360ac
+18 -11
View File
@@ -634,24 +634,28 @@ async function convert(input) {
// 额外:IMAGE 节点覆盖的 TEXT 节点也去掉(图片替代文字) // 额外:IMAGE 节点覆盖的 TEXT 节点也去掉(图片替代文字)
var imageRects = sg.children.filter(c => c.type === 'IMAGE' && c.rect).map(c => ({ var imageRects = sg.children.filter(c => c.type === 'IMAGE' && c.rect).map(c => ({
x: Math.round(c.rect.x), y: Math.round(c.rect.y), x: Math.round(c.rect.x), y: Math.round(c.rect.y),
w: Math.round(c.rect.w), h: Math.round(c.rect.h) w: Math.round(c.rect.w), h: Math.round(c.rect.h),
z: parseInt(c.styles?.zIndex) || 0
})); }));
var seen = {}; var seen = {};
var overlapRemove = new Set(); var overlapRemove = new Set();
for (var i = sg.children.length - 1; i >= 0; i--) { for (var i = sg.children.length - 1; i >= 0; i--) {
var ci = sg.children[i]; var ci = sg.children[i];
if (!ci.rect) continue; if (!ci.rect) continue;
// TEXT 节点被 IMAGE 完全覆盖或包含时移除 // TEXT 节点被 IMAGE 覆盖时移除(IMAGE 的 z-index >= TEXT 的 z-index
if (ci.type === 'TEXT') { if (ci.type === 'TEXT') {
var cx = Math.round(ci.rect.x), cy = Math.round(ci.rect.y); var cx = Math.round(ci.rect.x), cy = Math.round(ci.rect.y);
var cw = Math.round(ci.rect.w), ch = Math.round(ci.rect.h); var cw = Math.round(ci.rect.w), ch = Math.round(ci.rect.h);
var textZ = parseInt(ci.styles?.zIndex) || 0;
for (var ir of imageRects) { for (var ir of imageRects) {
// 完全重叠 // 检查坐标重叠或包含
var exactMatch = Math.abs(cx - ir.x) < 3 && Math.abs(cy - ir.y) < 3 && Math.abs(cw - ir.w) < 3 && Math.abs(ch - ir.h) < 3; var exactMatch = Math.abs(cx - ir.x) < 3 && Math.abs(cy - ir.y) < 3 && Math.abs(cw - ir.w) < 3 && Math.abs(ch - ir.h) < 3;
// TEXT 被 IMAGE 包含(IMAGE 在 TEXT 内部)
var contained = ir.x >= cx - 5 && ir.y >= cy - 5 && ir.x + ir.w <= cx + cw + 5 && ir.y + ir.h <= cy + ch + 5; var contained = ir.x >= cx - 5 && ir.y >= cy - 5 && ir.x + ir.w <= cx + cw + 5 && ir.y + ir.h <= cy + ch + 5;
if (exactMatch || contained) { if (exactMatch || contained) {
// IMAGE z-index >= TEXT z-index 时才移除(IMAGE 在上方)
if (ir.z >= textZ) {
overlapRemove.add(ci.id); overlapRemove.add(ci.id);
}
break; break;
} }
} }
@@ -927,20 +931,23 @@ async function convert(input) {
// ---------------------------------------------------------- // ----------------------------------------------------------
// 第三步:组装最终 Schema // 第三步:组装最终 Schema
// ---------------------------------------------------------- // ----------------------------------------------------------
// 用第一个 slide 容器尺寸决定画布比例 // 画布尺寸:多 slide(PPT设计稿)用容器尺寸,单 slide(网页)用 canvas
let layout = 'LAYOUT_16x9'; let layout = 'LAYOUT_16x9';
if (slideGroups.length > 0) { var sizeSource;
const sr = slideGroups[0].slideRect; if (slideGroups.length > 1) {
if (sr && sr.w && sr.h) { sizeSource = slideGroups[0].slideRect;
const sw = sr.w / 72; } else {
const sh = sr.h / 72; sizeSource = { w: canvas.width || 1920, h: canvas.height || 1080 };
}
if (sizeSource.w && sizeSource.h) {
const sw = sizeSource.w / 72;
const sh = sizeSource.h / 72;
layout = 'CUSTOM'; layout = 'CUSTOM';
return { return {
presentation: { layout: 'CUSTOM', slideWidth: sw, slideHeight: sh }, presentation: { layout: 'CUSTOM', slideWidth: sw, slideHeight: sh },
slides: slides slides: slides
}; };
} }
}
return { return {
presentation: { layout: layout }, presentation: { layout: layout },