线条与连接符

使用 line 属性绘制直线，使用 connector 属性绘制带箭头的连接线。

#线条形状

线条使用起止点坐标：

JSON

{
  "slides": [
    {
      "children": [
        {
          "line": {
            "x1": 50,
            "y1": 120,
            "x2": 800,
            "y2": 120,
            "properties": {
              "outline": {
                "color": "4472C4",
                "width": 2
              }
            }
          }
        }
      ]
    }
  ]
}

TypeScript

import { generatePresentation } from "@office-open/pptx";

generatePresentation({
  slides: [
    {
      children: [
        {
          line: {
            x1: 50,
            y1: 120,
            x2: 800,
            y2: 120,
            properties: {
              outline: { color: "4472C4", width: 2 },
            },
          },
        },
      ],
    },
  ],
});

#垂直线

JSON

{
  "slides": [
    {
      "children": [
        {
          "line": {
            "x1": 200,
            "y1": 150,
            "x2": 200,
            "y2": 450,
            "properties": {
              "outline": {
                "color": "ED7D31",
                "width": 2
              }
            }
          }
        }
      ]
    }
  ]
}

TypeScript

import { generatePresentation } from "@office-open/pptx";

generatePresentation({
  slides: [
    {
      children: [
        {
          line: {
            x1: 200,
            y1: 150,
            x2: 200,
            y2: 450,
            properties: {
              outline: { color: "ED7D31", width: 2 },
            },
          },
        },
      ],
    },
  ],
});

#对角线

JSON

{
  "slides": [
    {
      "children": [
        {
          "line": {
            "x1": 250,
            "y1": 150,
            "x2": 750,
            "y2": 450,
            "properties": {
              "outline": {
                "color": "70AD47",
                "width": 3
              }
            }
          }
        }
      ]
    }
  ]
}

TypeScript

import { generatePresentation } from "@office-open/pptx";

generatePresentation({
  slides: [
    {
      children: [
        {
          line: {
            x1: 250,
            y1: 150,
            x2: 750,
            y2: 450,
            properties: {
              outline: { color: "70AD47", width: 3 },
            },
          },
        },
      ],
    },
  ],
});

#带箭头的连接符

连接符支持箭头端点：

JSON

{
  "slides": [
    {
      "children": [
        {
          "connector": {
            "x1": 50,
            "y1": 130,
            "x2": 400,
            "y2": 130,
            "properties": {
              "outline": {
                "color": "4472C4",
                "width": 2,
                "tailEnd": {
                  "type": "triangle"
                }
              }
            }
          }
        },
        {
          "connector": {
            "x1": 50,
            "y1": 200,
            "x2": 400,
            "y2": 200,
            "properties": {
              "outline": {
                "color": "ED7D31",
                "width": 2,
                "headEnd": {
                  "type": "triangle"
                },
                "tailEnd": {
                  "type": "triangle"
                }
              }
            }
          }
        }
      ]
    }
  ]
}

TypeScript

import { generatePresentation } from "@office-open/pptx";

generatePresentation({
  slides: [
    {
      children: [
        {
          connector: {
            x1: 50,
            y1: 130,
            x2: 400,
            y2: 130,
            properties: {
              outline: { color: "4472C4", width: 2, tailEnd: { type: "triangle" } },
            },
          },
        },
        {
          connector: {
            x1: 50,
            y1: 200,
            x2: 400,
            y2: 200,
            properties: {
              outline: {
                color: "ED7D31",
                width: 2,
                headEnd: { type: "triangle" },
                tailEnd: { type: "triangle" },
              },
            },
          },
        },
      ],
    },
  ],
});

#箭头类型

箭头通过 outline.headEnd（起点）/ outline.tailEnd（终点）的 type 字段设置：

值	说明
`"triangle"`	实心三角形
`"stealth"`	隐形箭头
`"diamond"`	菱形
`"oval"`	椭圆形
`"arrow"`	开放箭头
`"none"`	无箭头

箭头还支持尺寸控制：

JSON

{
  "slides": [
    {
      "children": [
        {
          "connector": {
            "x1": 500,
            "y1": 410,
            "x2": 800,
            "y2": 410,
            "properties": {
              "outline": {
                "color": "ED7D31",
                "width": 2,
                "tailEnd": {
                  "type": "triangle",
                  "width": "large",
                  "length": "large"
                }
              }
            }
          }
        }
      ]
    }
  ]
}

TypeScript

import { generatePresentation } from "@office-open/pptx";

generatePresentation({
  slides: [
    {
      children: [
        {
          connector: {
            x1: 500,
            y1: 410,
            x2: 800,
            y2: 410,
            properties: {
              outline: {
                color: "ED7D31",
                width: 2,
                tailEnd: { type: "triangle", width: "large", length: "large" },
              },
            },
          },
        },
      ],
    },
  ],
});

#line 选项

属性	类型	说明
`x1`	`number`	起始 X 坐标
`y1`	`number`	起始 Y 坐标
`x2`	`number`	结束 X 坐标
`y2`	`number`	结束 Y 坐标
`fill`	`FillOptions`	线条填充
`outline`	`OutlineOptions`	轮廓（颜色、宽度、虚线、headEnd、tailEnd…）

#connector 选项

属性	类型	说明
`x1`	`number`	起始 X 坐标
`y1`	`number`	起始 Y 坐标
`x2`	`number`	结束 X 坐标
`y2`	`number`	结束 Y 坐标
`fill`	`FillOptions`	线条填充
`outline`	`OutlineOptions`	轮廓（颜色、宽度、虚线、headEnd、tailEnd…）— 箭头经 headEnd/tailEnd

#OutlineOptions

属性	类型	说明
`type`	`"noFill" \| "solidFill" \| "gradFill" \| "pattFill"`	填充类型（省略且有 `color` 时隐式 solidFill）
`color`	`string \| SolidFillOptions`	颜色（sRGB 十六进制字符串糖，如 `"4472C4"`）
`width`	`number \| UniversalMeasure`	线宽
`dash`	`"solid" \| "dash" \| "dot" \| "dashDot" \| ...`	预置虚线样式
`headEnd`	`{ type?, width?, length? }`	起点箭头
`tailEnd`	`{ type?, width?, length? }`	终点箭头