🔖 温馨提示：若您还能看到这句话，表示 UniPPTX 仍处于开发状态中，请关注 gitee 以获取最新开发进度😀。

GITEE: https://gitee.com/wfeng0/uni-pptx

项目首页: https://ppprzl-8909.csb.app

开发者文档: https://ppprzl-8909.csb.app#docs

备用文档: https://wf0.github.io/unippt.html

体验地址: https://ppprzl-8909.csb.app#demo

© 版权说明

1. 本项目基于 Apache License 2.0 协议，可免费使用，如需商用，请联系作者获取授权；

2. 项目在架构上，借鉴了 canvas-editor 的优秀思想，但仅用于系统架构设计部分；

3. 项目在页面布局、静态svg、图标上，直接或间接使用了PPTist的资源，感谢原作者;

4. 如果发现项目侵权部分，请及时联系删除，其他依赖均为开源项目，请查看对应开源项目的许可证，若因此产生的版权纠纷，作者概不负责。

📖 项目简介

1. Unite PowerPoint，是基于 Konva（canvas渲染方案）的 Web 在线演示文稿（幻灯片）编辑器；

2. 项目力争还原大部分 Office PowerPoint 常用功能，支持文字、图片、多媒体资源、形状、折线、统计图、表格、公式等常见元素类型，支持在 Web 端实现幻灯片的编辑、预览、导出、分享、协作等功能；

3. 为满足不同用户群体的需求，不仅提供了 npm 包，支持在 Vue、React、H5 等前端框架中使用，还提供了完整的项目源码，可快速搭建在线演示文稿项目；

4. 本项目开箱即用，拥有完整的官方 API 文档，方便开发者二次开发；

5. 同类优秀产品：PPTist、Slidev、revealjs 等（排名不分先后）。

🚀 项目运行

### 下载依赖
npm install

### 运行项目
npm run dev 

### 打包项目
npm run build ## 打包成项目类型
npm run lib ## 打包成库类型

💼 项目依赖

"devDependencies": {
    "eslint": "^9.9.0", // eslint 语法检查器
    "less": "^4.2.0", // less 预处理器
    "typescript": "^5.5.4", // ts 编译器
}

"dependencies": {
    "colorthief": "^2.4.0", // 图片主要颜色识别
    "gsap": "^3.12.5", // 动画库
    "html-to-image": "^1.11.11", // html 转图片
    "konva": "^9.3.14", // konva 绘图库
    "mathlive": "^0.101.0", // 公式编辑器
    "pptxgenjs": "^3.12.0", // pptx 导出实现
    "pptxtojson": "^1.0.3", // pptx 转 json（导入实现）
    "quill": "^2.0.2", // 富文本编辑器
    "vite": "^5.4.2", // vite 构建工具
    "y-websocket": "^2.0.4", // Yjs 协同服务类型
    "yjs": "^13.6.19",// Yjs 协同
},

📚 功能列表

备注：✅ 为已实现功能，❌ 为未实现功能 📅 为计划实现功能

协同

• ✅ 新建幻灯片（ID、顺序一致性）
• ✅ 删除幻灯片
• ✅ 用户加入协同/用户离开通知协同
• ✅ 文件重命名协同
• ✅ 插入矩形协同
• ✅ 插入文本协同
• ✅ 文本更新协同（group dbclick handle）
• ✅ shape drag end 位置更新协同
• ✅ shape transformer 形变更新协同
• ✅ 配色方案切换协同
• ✅ 背景设置协同
• ❌ 禅模式（仅能个人操作做协同演示）
• ❌ 元素属性修改协同
• ❌ 切换动画协同
• ❌ 元素动画协同
• ❌ 撤销重做协同

基础功能

• ✅ 历史记录（撤销、重做）
• ✅ 快捷键（系统快捷键、自定义快捷键）
• ✅ 右键菜单（支持画布菜单及元素菜单）
• ✅ 画布平移、缩放
• ✅ 自定义系统主题颜色（提供 :root 主题定制方案）
• ✅ 幻灯片设计（背景设置、网格设置、预设主题）
• ✅ PPTX文件导入导出
• ❌ PDF、图片、JSON 导入导出

幻灯片页面编辑

• ✅ 幻灯片页面新增与删除
• ✅ 画布网格线
• ✅ 翻页动画
• ✅ 元素动画（入场、退场、强调）
• ✅ 幻灯片顺序调整（支持 API、拖拽方式实现）
• ✅ 幻灯片配色方案切换题

幻灯片元素编辑

基础功能

• ✅ 元素添加、删除、拖拽、移动、旋转、缩放
• ✅ 元素多选、框选、单选
• ✅ 元素吸附对齐（移动和缩放）
• ✅ 元素属性设置（宽高、位置、边框、填充、文本等）
• ✅ 拖拽添加图文
• ✅ 元素复制粘贴

文字

• ✅ 普通文本编辑
• ✅ 富文本编辑
• ✅ 属性设置

图片

• ✅ 图片上传（本地上传、拖拽上传）

线条

• ✅ 直线、基础折线/曲线
• ✅ 线段吸附图形
• ✅ 线段跟随移动
• ✅ 属性设置

统计图

• ✅ 柱状体、折线图、饼图、雷达图
• ✅ 图表转换、图表配置

表格

• ✅ 表格数据编辑
• ✅ 动态增删行列

公式

• ✅ LaTex 公式编辑
• ✅ 直接编辑公式，所见即所得

幻灯片放映

• ✅ 幻灯片预览(当前预览、从头预览)
• ✅ 屏幕录制
• ❌ 动画播放

📝 计划实现功能

• 📅 计划支持 图片裁剪（自定义、按形状、按纵横比）、滤镜、着色
• 📅 计划支持 元素超链接（链接到网页、链接到其他幻灯片页面）
• 📅 计划支持 元素组合、锁定、批量编辑
• 📅 计划支持 演讲者备注（富文本）
• 📅 计划支持 元素顶点编辑
• 📅 计划支持 支持渐变背景（幻灯片、元素、文本）
• 📅 计划支持 艺术字、内置文本样式
• 📅 计划支持 查找、替换
• 📅 计划支持 表格的合并、个性化定制功能
• 📅 计划支持 丰富元素基本类型、计划增加图标功能
• 📅 计划支持 统计图、表格 计划支持动态属性（根据某个幻灯片、表格的数据，动态渲染）
• 📅 计划支持 流程图工具（集成 Excalidraw ）
• 📅 计划支持 画笔工具（预览时，新增 canvas 实现画笔工具）
• 📅 计划支持 uniscript（允许用户编写相关程序，实现幻灯片功能）

🔗 相关资料

• mathlive
• pptxtojson
• PPTist Github
• PPTist 体验地址
• 基于 Konva 实现Web PPT 编辑器（一）
• 基于 Konva 实现Web PPT 编辑器（二）