零代码基础也能掌握的JavaScript演示工具：从安装到企业级应用

// 从API获取最新财务数据 async function generateFinancialReport() { const pptx = new PptxGenJS(); const financialData = await fetch('/api/quarterly-results'); // 设置公司品牌主题 pptx.defineSlideMaster({ title: 'Financial Report Master', background: { color: 'F5F7FA' }, objects: [ { text: { text: 'Q3 2023 Financial Results', options: { fontSize: 28, bold: true } } }, { image: { path: './company-logo.png', x: 8, y: 0.5, w: 2, h: 0.8 } } ] }); // 自动生成收入分析页面 const revenueSlide = pptx.addSlide('Financial Report Master'); revenueSlide.addChart(pptx.charts.BAR, financialData.revenueData, { x: 1, y: 1.5, w: 8, h: 5, title: 'Quarterly Revenue by Region', legendPos: 'b' }); // 生成利润分析页面 const profitSlide = pptx.addSlide('Financial Report Master'); profitSlide.addTable(financialData.profitTable, { x: 1, y: 1.5, w: 8, h: 5, fill: { color: 'E8F4F9' }, rowHeights: [0.6, 0.4, 0.4, 0.4, 0.4] }); // 保存为PPTX文件 return pptx.writeFile({ fileName: `Financial-Report-Q3-2023.pptx` }); }

// 内容引擎核心模块 class PresentationEngine { constructor(template) { this.pptx = new PptxGenJS(); this.template = template; this.slideCount = 0; } // 添加文本内容页面 addContentSlide(contentConfig) { const slide = this.pptx.addSlide(this.template.master); // 动态添加标题 if (contentConfig.title) { slide.addText(contentConfig.title, { x: 1, y: 1, w: 8, h: 1, fontSize: 24, color: this.template.titleColor, bold: true }); } // 动态添加段落内容 if (contentConfig.paragraphs && contentConfig.paragraphs.length > 0) { let currentY = 2.5; contentConfig.paragraphs.forEach(para => { slide.addText(para.text, { x: 1, y: currentY, w: 8, h: 0.8, fontSize: para.size || 14, color: para.color || this.template.textColor }); currentY += 0.8; }); } this.slideCount++; return slide; } // 添加数据表格页面 addTableSlide(tableConfig) { const slide = this.pptx.addSlide(this.template.master); // 添加表格标题 slide.addText(tableConfig.title, { x: 1, y: 1, w: 8, h: 1, fontSize: 24, bold: true }); // 添加表格内容 slide.addTable(tableConfig.data, { x: 1, y: 2.2, w: 8, h: 5, firstRow: { fill: this.template.tableHeaderColor }, rowHeights: tableConfig.rowHeights || 0.5, colWidths: tableConfig.colWidths || 2 }); this.slideCount++; return slide; } // 生成并保存演示文稿 generatePresentation(fileName) { return this.pptx.writeFile({ fileName }); } } // 使用示例 const engine = new PresentationEngine({ master: 'Corporate Master', titleColor: '2D3748', textColor: '4A5568', tableHeaderColor: 'EDF2F7' }); // 添加内容页面 engine.addContentSlide({ title: '市场分析概述', paragraphs: [ { text: '本季度市场份额增长23%，超出预期5个百分点', size: 16 }, { text: '主要增长来自亚太地区，同比增长37%' }, { text: '欧洲市场保持稳定，北美市场略有下滑' } ] });

// 定义企业品牌主题 function defineCorporateTheme(pptx) { // 定义颜色方案 pptx.defineTheme({ name: 'Corporate Theme', colorScheme: { primary: '1A365D', // 企业主色 secondary: '2B6CB0', // 辅助色 accent1: 'ED8936', // 强调色1 accent2: '3182CE', // 强调色2 accent3: '38B2AC', // 强调色3 accent4: '48BB78', // 强调色4 accent5: '805AD5', // 强调色5 accent6: 'F56565' // 强调色6 }, fontScheme: { title: { font: 'Helvetica Neue', size: 28 }, body: { font: 'Helvetica', size: 14 } } }); // 创建标题母版 pptx.defineSlideMaster({ title: 'Title Master', background: { color: 'F7FAFC' }, objects: [ // 公司logo { image: { path: './assets/logo.png', x: 0.5, y: 0.5, w: 2.5, h: 0.8 } }, // 页脚信息 { text: { text: 'Confidential | {{currentDate}}', options: { x: 0.5, y: 7.2, w: 9, h: 0.3, fontSize: 10 } } }, // 页码 { text: { text: '{{slideNumber}}/{{totalSlides}}', options: { x: 9.5, y: 7.2, w: 1, h: 0.3, fontSize: 10, align: 'right' } } } ] }); // 创建内容母版 pptx.defineSlideMaster({ title: 'Content Master', background: { color: 'FFFFFF' }, objects: [ { image: { path: './assets/logo-small.png', x: 9, y: 0.5, w: 1.5, h: 0.5 } }, { text: { text: 'Confidential | {{currentDate}}', options: { x: 0.5, y: 7.2, w: 9, h: 0.3, fontSize: 10 } } }, { text: { text: '{{slideNumber}}/{{totalSlides}}', options: { x: 9.5, y: 7.2, w: 1, h: 0.3, fontSize: 10, align: 'right' } } } ] }); return pptx; }

# 1. 创建项目目录 mkdir presentation-automation && cd presentation-automation # 2. 初始化项目 npm init -y # 3. 安装PptxGenJS核心包 npm install pptxgenjs --save # 4. 创建基本配置文件 cat > config.js << EOL module.exports = { companyName: 'Your Company', theme: { primaryColor: '1A365D', logoPath: './assets/logo.png' }, dataSources: { salesAPI: 'https://api.yourcompany.com/sales-data' } }; EOL # 5. 创建示例脚本 cat > demo.js << EOL const PptxGenJS = require('pptxgenjs'); const config = require('./config'); async function createDemoPresentation() { const pptx = new PptxGenJS(); // 设置基本信息 pptx.setTitle(config.companyName + ' - Demo Presentation'); // 添加标题页 const titleSlide = pptx.addSlide(); titleSlide.addText(config.companyName + '演示文稿', { x: 1, y: 2, w: 8, h: 1.5, fontSize: 36, color: config.theme.primaryColor, bold: true, align: 'center' }); // 保存演示文稿 await pptx.writeFile({ fileName: 'demo-presentation.pptx' }); console.log('演示文稿创建成功！'); } // 执行创建 createDemoPresentation().catch(err => console.error('创建失败:', err)); EOL # 6. 运行示例 node demo.js

// 高性能演示文稿生成器 class HighPerformancePptxGenerator { constructor() { this.pptx = new PptxGenJS(); this.slideQueue = []; this.batchSize = 10; // 每批处理10页 this.isProcessing = false; } // 添加幻灯片到队列 queueSlide(slideConfig) { this.slideQueue.push(slideConfig); // 如果不在处理中，开始处理队列 if (!this.isProcessing) { this.processQueue(); } } // 批量处理幻灯片队列 async processQueue() { this.isProcessing = true; const batch = this.slideQueue.splice(0, this.batchSize); try { // 批量添加幻灯片 for (const config of batch) { await this.addSlideWithRetry(config); } // 如果还有剩余幻灯片，继续处理 if (this.slideQueue.length > 0) { // 短暂延迟，允许垃圾回收 setTimeout(() => this.processQueue(), 100); } else { this.isProcessing = false; } } catch (error) { console.error('处理幻灯片队列出错:', error); this.isProcessing = false; } } // 添加幻灯片并支持重试 async addSlideWithRetry(config, retries = 3) { try { switch(config.type) { case 'chart': return this.addChartSlide(config.data); case 'table': return this.addTableSlide(config.data); default: return this.addContentSlide(config.data); } } catch (error) { if (retries > 0) { console.log(`添加幻灯片失败，重试${retries}次`); return this.addSlideWithRetry(config, retries - 1); } throw error; } } // 添加图表幻灯片 addChartSlide(data) { const slide = this.pptx.addSlide(); // 图表渲染代码... return slide; } // 添加表格幻灯片 addTableSlide(data) { const slide = this.pptx.addSlide(); // 表格渲染代码... return slide; } // 添加内容幻灯片 addContentSlide(data) { const slide = this.pptx.addSlide(); // 内容渲染代码... return slide; } // 生成演示文稿 async generate(fileName) { // 等待所有队列处理完成 while (this.isProcessing || this.slideQueue.length > 0) { await new Promise(resolve => setTimeout(resolve, 100)); } return this.pptx.writeFile({ fileName }); } } // 使用示例 const generator = new HighPerformancePptxGenerator(); // 批量添加100个幻灯片 for (let i = 0; i < 100; i++) { generator.queueSlide({ type: 'chart', data: { title: `图表页面 ${i+1}`, dataset: generateRandomData() } }); } // 生成演示文稿 generator.generate('large-presentation.pptx');