fix: 画布尺寸 — 多slide用容器rect,单slide用canvas
- PPT设计稿(多slide):用容器rect,每页独立尺寸 - 网页(单slide):用canvas尺寸,确保内容不溢出
This commit is contained in:
+24
-17
@@ -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) {
|
||||||
overlapRemove.add(ci.id);
|
// IMAGE z-index >= TEXT z-index 时才移除(IMAGE 在上方)
|
||||||
|
if (ir.z >= textZ) {
|
||||||
|
overlapRemove.add(ci.id);
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -927,19 +931,22 @@ 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 };
|
||||||
layout = 'CUSTOM';
|
}
|
||||||
return {
|
if (sizeSource.w && sizeSource.h) {
|
||||||
presentation: { layout: 'CUSTOM', slideWidth: sw, slideHeight: sh },
|
const sw = sizeSource.w / 72;
|
||||||
slides: slides
|
const sh = sizeSource.h / 72;
|
||||||
};
|
layout = 'CUSTOM';
|
||||||
}
|
return {
|
||||||
|
presentation: { layout: 'CUSTOM', slideWidth: sw, slideHeight: sh },
|
||||||
|
slides: slides
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|||||||
Reference in New Issue
Block a user