SmartArt
使用 smartart 字段添加 SmartArt 图形 — 预定义的图示布局,用于可视化流程、层级结构、关系等。
基本 SmartArt
import { generatePresentation } from "@office-open/pptx";
{
"slides": [
{
"children": [
{
"smartart": {
"x": "1.3cm",
"y": "1.3cm",
"width": "21.2cm",
"height": "9.3cm",
"layout": "default",
"style": "simple1",
"color": "accent1_2",
"nodes": [{ "text": "Step 1" }, { "text": "Step 2" }, { "text": "Step 3" }]
}
}
]
}
]
}
{
smartart: {
x: "1.3cm",
y: "1.3cm",
width: "21.2cm",
height: "9.3cm",
layout: "default",
style: "simple1",
color: "accent1_2",
nodes: [
{ text: "Step 1" },
{ text: "Step 2" },
{ text: "Step 3" },
],
},
}
嵌套节点
节点支持嵌套 children,用于层级数据:
{
"slides": [
{
"children": [
{
"smartart": {
"x": "1.3cm",
"y": "1.3cm",
"width": "21.2cm",
"height": "10.6cm",
"layout": "default",
"nodes": [
{ "text": "Item A", "children": [{ "text": "Sub A1" }, { "text": "Sub A2" }] },
{ "text": "Item B", "children": [{ "text": "Sub B1" }] },
{ "text": "Item C" }
]
}
}
]
}
]
}
{
smartart: {
x: "1.3cm",
y: "1.3cm",
width: "21.2cm",
height: "10.6cm",
layout: "default",
nodes: [
{
text: "Item A",
children: [{ text: "Sub A1" }, { text: "Sub A2" }],
},
{
text: "Item B",
children: [{ text: "Sub B1" }],
},
{ text: "Item C" },
],
},
}
SmartArt 样式
控制视觉样式和配色方案:
{
"slides": [
{
"children": [
{
"smartart": {
"x": "1.3cm",
"y": "1.3cm",
"width": "21.2cm",
"height": "9.3cm",
"layout": "process1",
"nodes": [{ "text": "Phase 1" }, { "text": "Phase 2" }, { "text": "Phase 3" }],
"color": "accent2_1",
"style": "simple1"
}
}
]
}
]
}
{
smartart: {
x: "1.3cm",
y: "1.3cm",
width: "21.2cm",
height: "9.3cm",
layout: "process1",
nodes: [{ text: "Phase 1" }, { text: "Phase 2" }, { text: "Phase 3" }],
color: "accent2_1", // 配色方案
style: "simple1", // 视觉样式
},
}
SmartArt 选项
| 选项 | 类型 | 说明 |
| -------- | ------------ | ---------------------------------------------- | -------- |
| x | number | UniversalMeasure | 水平位置 |
| y | number | UniversalMeasure | 垂直位置 |
| width | number | UniversalMeasure | 宽度 |
| height | number | UniversalMeasure | 高度 |
| layout | string | 布局 ID(如 "default"、"process1") |
| style | string | 快速样式 ID(如 "simple1"、"moderate1") |
| color | string | 配色变换 ID(如 "accent1_2"、"colorful1") |
| nodes | TreeNode[] | { text, children? } 对象数组 |