分享免费的编程资源和教程

网站首页 > 技术教程 正文

推荐一个免费功能强大JS前端生成幻灯片库PptxGenJS

goqiw 2024-09-08 17:14:33 技术教程 13 ℃ 0 评论

记得在5年前,当时我还在上个东家负责实施项目管理系统的时候,当时的方案是项目计划管理子系统主要用Project Server实现,这个主要由供应商帮我们负责实施落地,但其他子系统均在Sharepoint上进行内部自行开发实施,其中我负责自研实施的项目风险管理子系统,业务有一个需求就是针对每个风险不仅能够方便网页展示,另外需要一个导出项目风险一页纸的PPT的功能,所以我当时就想,当时前端已很强大了(另外一个项目风险Excel导入功能,我就是找了一个免费Javascript Excel库完成的),那有没有前端生成PPT的免费JS库呢?经过一番查找和研究测试,我发现了一个免费功能强大的Javascript生成PowerPoint库:PptxGenJS,并按业务需求最终完成了导出项目风险一页纸的PPT功能。2021年12月13日发布了PptxGenJS最新版本V3.9.0,它的官网地址:http://gitbrent.github.io/PptxGenJS/在线Demo地址:http://gitbrent.github.io/PptxGenJS/demos/

它的github源代码仓库:https://github.com/gitbrent/PptxGenJS。PptxGenJS创建与Microsoft PowerPoint、Apple Keynote和其他应用程序兼容的Open Office XML(OOXML) 演示文稿。它的功能特性如下:

一、Works Everywhere

1.支持所有现代桌面和移动浏览器

2.与Node、Angular、React和 Electron集成

3.与PowerPoint、Keynote等兼容

二、Full Featured

1.所有主要对象类型均可用(图表、形状、表格等)

2.用于学术/企业品牌的主幻灯片

3.SVG图像、GIF动画、YouTube视频、RTL文本和亚洲字体

三、Simple And Powerful

1.绝对最容易使用的PowerPoint库

2.在编写代码时学习将包括完整的typescript定义

3.包含大量演示代码(超过75张功能幻灯片)

四、Export Your Way

1.将文件直接导出到具有正确MIME类型的客户端浏览器

2.其他可用的导出格式:base64、blob、流等。

3.演示压缩选项等

五、HTML To PowerPoint

1.PowerPoint功能,只需一行代码即可将HTML表格转换为演示文稿

安装:

1、打包: Modern Browsers and IE 11

<script  src =" pptxGenJS/dist/pptxgen.bundle.js " > </script >

2、最小:Modern Browsers

<script  src =" PptxGenJS/libs/jszip.min.js " > </script > 
<script  src =" PptxGenJS/dist/pptxgen.min.js " > </script >

简单实例:

1、HTML转PowerPoint

let pptx = new PptxGenJS();
pptx.tableToSlides("tableElementId");
pptx.writeFile({ fileName: "html2pptx-demo.pptx" });

2、创建一个PowerPoint

let pres = new PptxGenJS();

3、创建并保存多个PowerPoint

let pptx = null;

// Presentation 1:
pptx = new PptxGenJS();
pptx.addSlide().addText("Presentation 1", { x: 1, y: 1 });
pptx.writeFile({ fileName: "PptxGenJS-Presentation-1" });

// Presentation 2:
pptx = new PptxGenJS();
pptx.addSlide().addText("Presentation 2", { x: 1, y: 1 });
pptx.writeFile({ fileName: "PptxGenJS-Presentation-2" });

4、添加多媒体到PowerPoint

// Path: full or relative
slide.addMedia({ type: "video", path: "https://example.com/media/sample.mov" });
slide.addMedia({ type: "video", path: "../media/sample.mov" });

// Base64: pre-encoded string
slide.addMedia({ type: "audio", data: "audio/mp3;base64,iVtDafDrBF[...]=" });

// YouTube: Online video (supported in Microsoft 365)
slide.addMedia({ type: "online", link: "https://www.youtube.com/embed/Dph6ynRVyUc" });

其他功能就不一一介绍了,有兴趣的话,您可以自行研究或也欢迎联系我进行交流。

如果您喜欢这篇文章,请关注我,收藏、点赞、评论和转发,会让更多需要帮助的人看到这篇文章。举手之劳,善莫大焉!

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表