Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

pptxgenjs-angular

gitbrent876MIT1.0.0-beta

JavaScript library that creates PowerPoint presentations

javascript-create-powerpoint, javascript-create-pptx, javascript-generate-pptx, javascript-pptx, javascript-powerpoint, javascript-powerpoint-charts, javascript-powerpoint-online, js-create-powerpoint, js-create-pptx, js-generate-powerpoint, js-generate-powerpoint-charts, js-powerpoint, js-powerpoint-pptx, js-powerpoint-library

readme

Open Source Love MIT Licence npm version npm downloads

PptxGenJS (Angular-cli compatible fork)

JavaScript library that produces PowerPoint (pptx) presentations

Quickly and easily create PowerPoint presentations with a few simple JavaScript commands in client web browsers or Node desktop apps.

Main Features

  • Widely Supported: Creates and downloads presentations on all current web browsers (Chrome, Edge, Firefox, etc.) and IE11
  • Full Featured: Slides can include Charts, Images, Media, Shapes, Tables and Text (plus Master Slides/Templates)
  • Easy To Use: Entire PowerPoint presentations can be created in a few lines of code
  • Modern: Pure JavaScript solution - everything necessary to create PowerPoint PPT exports is included

Additional Features

  • Use the unique HTML-to-PowerPoint feature to copy an HTML table into 1 or more Slides with a single command

Table of Contents (generated with DocToc)


Live Demo

Use JavaScript to create a PowerPoint presentation with your web browser right now:
https://gitbrent.github.io/PptxGenJS

Installation

Client-side Angular-cli

Install this FORK with npm

Download and copy pptxgenjs-angular-1.0.0-beta.tgz to your project directory.

Then run:

    npm install ./pptxgenjs-angular-1.0.0-beta.tgz

Update your project's angular.json file:

        "scripts": [
          "node_modules/pptxgenjs-angular/libs/jquery.min.js",
          "node_modules/pptxgenjs-angular/libs/jszip.min.js",
          "node_modules/pptxgenjs-angular/libs/promise.min.js",
        ]

Start the app:

ng serve

Now you can import PptxGenJS in your components like so:

import * as PptxGenJS  from 'pptxgenjs-angular'

Client-Side NON-ANGULAR, DO NOT USE THIS FORK

Include Local Scripts

<script lang="javascript" src="PptxGenJS/libs/jquery.min.js"></script>
<script lang="javascript" src="PptxGenJS/libs/jszip.min.js"></script>
<script lang="javascript" src="PptxGenJS/dist/pptxgen.js"></script>
  • IE11 support requires a Promises polyfill as well (included in the libs folder)

Include Bundled Script

<script lang="javascript" src="PptxGenJS/dist/pptxgen.bundle.js"></script>
  • Bundle script includes all libraries: jQuery + JSzip + PptxGenJS + Promises

Install With Bower

bower install pptxgen

Node.js

PptxGenJS NPM Homepage

npm install pptxgenjs

var pptx = require("pptxgenjs");
  • Desktop: Compatible with Electron applications

Quick Start Guide

PptxGenJS PowerPoint presentations are created via JavaScript by following 4 basic steps:

  1. Create a new Presentation
  2. Add a Slide
  3. Add one or more objects (Tables, Shapes, Images, Text and Media) to the Slide
  4. Save the Presentation
var pptx = new PptxGenJS();
var slide = pptx.addNewSlide();
slide.addText('Hello World!', { x:1.5, y:1.5, fontSize:18, color:'363636' });
pptx.save('Sample Presentation');

That's really all there is to it!


Library API

Presentation Creation/Options

Creating a Presentation
Presentation Options

Slide Creation/Options

Adding a Slide
Slide Options

Saving a Presentation

Saving a Presentation

Master Slides and Corporate Branding

Master Slides

Adding Charts

Adding Charts

Adding Images

Adding Images

Adding Media (Audio/Video/YouTube)

Adding Media

Adding Shapes

Adding Shapes

Adding Tables

Adding Tables

Adding Text

Adding Text

Including Speaker Notes

Speaker Notes

Using Scheme Colors

Using Scheme Colors


HTML-to-PowerPoint Feature

HTML-to-PowerPoint


Integration with Other Libraries

Integration with Other Libraries


Full PowerPoint Shape Library

If you are planning on creating Shapes (basically anything other than Text, Tables or Rectangles), then you'll want to include the pptxgen.shapes.js library.

The shapes file contains a complete PowerPoint Shape object array thanks to the officegen project.

<script lang="javascript" src="PptxGenJS/dist/pptxgen.shapes.js"></script>

Typescript Definitions

As of version 2.3.0, typescript definitions are available (pptxgen.d.ts).


Issues / Suggestions

Please file issues or suggestions on the issues page on github, or even better, submit a pull request. Feedback is always welcome!

When reporting issues, please include a code snippet or a link demonstrating the problem. Here is a small jsFiddle that is already configured and uses the latest PptxGenJS code.


Need Help?

Sometimes implementing a new library can be a difficult task and the slightest mistake will keep something from working. We've all been there!

If you are having issues getting a presentation to generate, check out the demos in the examples directory. There are demos for both Nodejs and client-browsers that contain working examples of every available library feature.


Unimplemented Features

The PptxGenJS library is not designed to replicate all the functionality of PowerPoint, meaning several features are not on the development roadmap.

These include:

  • Animations
  • Importing Existing Presentations and/or Templates
  • Outlines
  • SmartArt

Special Thanks


Support Us

Do you like this library and find it useful? Tell the world about us! PptxGenJS project

Thanks to everyone who supports this project! ❤


License

Copyright © 2015-2018 Brent Ely

MIT

changelog

Changelog

All notable changes to this project will be documented in this file.

The format is based on Keep a Changelog, and this project adheres to Semantic Versioning.

[Unreleased]

[2.4.0] - 2018-??-??

Added

Changed

Removed

v2.3.0 (2018-09-12)

Full Changelog

Highlights:

  • New Feature: Placeholders
  • New Feature: Speaker Notes
  • addImage() can now load both local ("../img.png") and remote images ("https://wikimedia.org/logo.jpg")
  • Typescript definitions are now available
  • jquery-node replaced with latest jquery package [only affects npm users]

Fixed Bugs:

Implemented Enhancements:

  • addImage() updated with new code allowing both local and remote images to be used (browser and Node). (gitbrent)
  • Typescript definitions have been created for the PptxGenJS API Methods (pptxgen.d.ts). (gitbrent)
  • New Feature: Placeholder support in Master Slides #359 (conbow)
  • New Feature: Speaker Notes #239 #361 (travispwingo)
  • New Chart Option: displayBlanksAs #365 (guipas)
  • New Feature: ability to hide slides #367 (ReimaFrgos)
  • Add second Cat Axis for Scatter and Bubble #372 (KrishnaTejaReddyV)
  • New Chart Type: Add radar chart implementation #386 (loictro)

v2.2.0 (2018-06-17)

Full Changelog

Fixed Bugs:

Implemented Enhancements:

  • New Feature! addImage() and addMedia() methods now accept URLs #325 (gitbrent)
  • Make Node detection more robust #277 (adrianirwin) (DSheffield)
  • Updated pptxgenjs-demo files to use CDNs instead of local files (gitbrent)
  • Updated Node.js detection to increase reliability for Angular users et al. (gitbrent)
  • Add w and h attributes to slideNumber() #336 (s7726)

v2.1.0 (2018-04-02)

Full Changelog

Fixed Bugs:

  • HTML-to-PowerPoint is creating many extra columns with colspan #284 (svaak)
  • HTML-to-PowerPoint rowspan is not working (gitbrent)
  • Fix docs/examples to use new fontSize, remove unsupported font_size #297 (pstoll)

Implemented Enhancements:

v2.0.0 (2018-01-23)

Full Changelog

BREAKING CHANGES

  • NodeJS instantiation is now standard (see Issue #83 and examples/nodejs-demo.js) which now allows new instances/presentations
  • (See "Version 2.0 Breaking Changes" in the README for a complete list)

Fixed Bugs:

  • Master Slide slide number doesn't show using "New Slide" PPT Function #229 (ineran)
  • Values of 0 (zero) in series are missing in line chart #240 (andrei-cs)
  • Node: "DeprecationWarning: Calling an asynchronous function without callback is deprecated." #252 (the-yadu)
  • The UP_DOWN_ARROW shape appears to have duplicate keys #253 (heavysixer)
  • Local demo can not run in IE #273 (IvanTao)

Implemented Enhancements:

v1.10.0 (2017-11-14)

Full Changelog

Fixed Bugs:

  • Fixed bug that was preventing 'chartColorsOpacity' from being anything other than 50 percent. (gitbrent)
  • The newPageStartY option is not being honored by addSlidesForTable() #222 (shaunvdp)
  • Line chart with one series displays broken #225 (andrei-cs)
  • The *AxisLineShow chart options do not work #231 (mconlin)

Implemented Enhancements:

v1.9.0 (2017-10-10)

Full Changelog

Fixed Bugs:

  • Vertical align and line break bug since update #79 (mirkoint)
  • Save callback is not called by client-browser when there are images to encode #187 (Malangs)
  • Promise Dependency - TypeError: Promise.all is not a function #188 (bartolomeu)
  • Default text size in empty cells making row height too big #193 (mreilaender)
  • Fixed issue that included many extraneous tab characters in the table demo lorem-ipsum text (GitBrent)
  • Fix chart issue: Entities encoding #204 (clubajax)
  • Fix chart issue: val axis #205 (clubajax)
  • Fix chart issue: Line chart series colors were not being respected #206 (kyrrigle)
  • Discrepancy between docs and code regarding setting a slide's background #207 (msambarino)
  • Fix chart issue: bar color regression #210 (clubajax)

Implemented Enhancements:

v1.8.0 (2017-09-12)

Full Changelog

Fixed Bugs:

Implemented Enhancements:

v1.7.0 (2017-08-07)

Full Changelog

Fixed Bugs:

Implemented Enhancements:

  • Add charts to Masters/Templates #114 (yipiha)
  • Format text as a superscript in a table cell #120 (aranard)

v1.6.0 (2017-07-17)

Full Changelog

Fixed Bugs:

  • The width or the height must be an integer not a float #29 (badlee)

Implemented Enhancements:

v1.5.0 (2017-05-26)

Full Changelog

Fixed Bugs:

Implemented Enhancements:

  • Add ability to create charts #51 (alagarrk)
  • Added image type to shapes to allow images to be placed on top of shapes, added more properties to ppt document #53 (ericwgreene)
  • Add support for RTL (Right-to-Left) text for Arabic etc. #73 (vanekar)
  • Shape line Diagonal #75 (vanekar)
  • Add hyperlink to Image #77 (plopez7)
  • Adding rounding radius for texts and shapes and dash options for the outline #86 (ivolazy)

v1.4.0 (2017-04-10)

Full Changelog

Fixed Bugs:

  • Auto Paging does not include master template on additional slides #61 (tb23911)
  • Issue calculating the available height for a table using Auto paging #64 (tb23911)
  • Multiple a:bodyPr tags within a:txBody causes damaged presentation in PowerPoint 2007 #69 (ZouhaierSebri)
  • Text bug #71 (alexbai31)
  • Errors when using Webpack/Typescript #72 (Vivihung)

Implemented Enhancements:

  • Add Slide Number formatting options #68 (ZouhaierSebri)
  • Added new feature: Hyperlinks as a text option

v1.3.0 (2017-03-22)

Full Changelog

Fixed Bugs:

  • Added image type to shapes to allow images to be placed on top of shapes, added more properties to ppt document #53 (ericwgreene)
  • Table-to-Slides default for un-styled tables is black text on black bkgd #57 (orpitadutta)
  • Table Header and Auto Paging #62 (tb23911)

Implemented Enhancements:

  • Removed FileSaver.js as a required library (only JSZip and jQuery are required now)
  • Allow text multi-formatting in single table cells #24 (jenkinsns)
  • Set fixed width to column using addSlidesForTable() #42 (priyaraskar)
  • Enhance bullet feature: offer diff types of bullets and add numbering option #49 (gitbrent)
  • Add 4 new Presentation properties: author, company, revision, subject #53 (ericwgreene)
  • Moved to semver (semantic versioning)

v1.2.1 (2017-02-26)

Full Changelog

Fixed Bugs:

  • Fixed issue with using percentages with x,y,w,h in addTable()
  • Table formatting bug with rowspans and colspans #46 (itskun)

Implemented Enhancements:

  • Allow more than a single 'x' and/or 'y' table location during Table Paging #43 (jenkinsns)
  • Bullets do not work with text objects in addText() method #44 (ellisgl)
  • Table location and pagination #47 (itskun)
  • Meta: Improve auto-paging in 'addTable()' #48 (gitbrent)
  • Created a new common file (pptxgenjs-demo.js) to hold all demo code - now used by both the browser and the node demos.

v1.2.0 (2017-02-15)

Full Changelog

Implemented Enhancements:

Fixed Bugs:

  • Table formatting bug in addTable() #36 (itskun)

v1.1.6 (2017-01-19)

Full Changelog

Implemented Enhancements:

  • Support for animated GIFs in addImage() #22 (shashank2104)
  • Added new slideNumber option allowing x and y placement of slide number #25 (priyaraskar)

v1.1.5 (2017-01-17)

Full Changelog

Fixed Bugs:

v1.1.4 (2017-01-04)

Full Changelog

Fixed Bugs:

  • Table formatting options set to default on empty cells #20 (rikvdk)
  • Fixed issue with addTable() where passing "#" before hex value for color or fill option would generate an invalid slide

v1.1.3 (2016-12-28)

Full Changelog

Implemented Enhancements:

  • Add new options to addSlidesForTable() allowing for placement and size: x,y,w,h #18 (priyaraskar)

Fixed Bugs:

v1.1.2 (2016-12-16)

Full Changelog

Implemented Enhancements:

  • The Slide addTable() method was modified to reduce the options passed from 2 objects to a single one

Fixed Bugs:

  • The colW addTable() option is not working #15 (ninas880025)
  • Modified addSlidesForTable(): table selectors made more specific by selecting only direct children now (nested tables would cause excessive looping) #14 (forrahul123)
  • Fixed crash caused by calling addText without an options object

v1.1.1 (2016-12-08)

Full Changelog

Implemented Enhancements:

  • Major documentation update
  • Added instructions to pptxgenjs.masters.js file, plus more examples and code
  • Added sandbox/ad-hoc code area to demo page

Fixed Bugs:

  • Table with 7 columns generates an invalid pptx file #12 (rikvdk)

v1.1.0 (2016-11-22)

Full Changelog

Implemented Enhancements:

Fixed Bugs:

v1.0.1 (2016-09-03)

Full Changelog

Implemented enhancements:

  • Moved from cx and cy option keys to w and h
  • Adding ability to load data uri as images/Updating jszip library #2 (DzmitryDulko)
  • Publish library as npm package #3 (DzmitryDulko)

Fixed Bugs:

v1.0.0 (2016-03-29)

Initial Release