Javascript PPTXGenJS Library Example to Generate Powerpoint (.PPTX) Presentations From Text & Images in Browser

Post author:admin
Post published:June 23, 2022
Post category:javascript
Post comments:0 Comments

index.html

<script src="https://cdn.jsdelivr.net/gh/gitbrent/pptxgenjs@3.10.0/dist/pptxgen.bundle.js"></script>
<div>
    <h1>PptxGenJS Demo</h1>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<script>
    let pptx = new PptxGenJS();
  let slide1 = pptx.addSlide();
  let opts1 = {
    x: 0.0,
    y: 0.25,
    w: '100%',
    h: 1.5,
    align: 'center',
    fontSize: 24,
    color: '0088CC',
    fill: 'F1F1F1'
  };
  slide1.addText(
    'This is the First Slide of the PPTX Presentation',
    opts1
  );
  let slide2 = pptx.addSlide()
  let opts2 = {
    x: 2.0,
    y: 0.75,
    w: '100%',
    h: 1.5,
    align: 'center',
    fontSize: 24,
    color: 'fff',
    fill: '000'
  }

  slide2.addText("JOHN WILLIAMSON LATHAM IS THE CAPTAIN OF NEW ZEALAND",opts1)

  let slide3 = pptx.addSlide();

// Image from remote URL
slide3.addImage({
  path:"https://cdn.pixabay.com/photo/2014/05/26/13/32/butterfly-354528__340.jpg",
  x: "15%",
  y: "1%",
  h: "75%",
  w: "75%"
});
  pptx.writeFile();
</script>

<div>

<h1>PptxGenJS Demo</h1>

</div>

let pptx = new PptxGenJS();

let slide1 = pptx.addSlide();

let opts1 = {

x: 0.0,

y: 0.25,

w: '100%',

h: 1.5,

align: 'center',

fontSize: 24,

color: '0088CC',

fill: 'F1F1F1'

};

slide1.addText(

'This is the First Slide of the PPTX Presentation',

opts1

);

let slide2 = pptx.addSlide()

let opts2 = {

x: 2.0,

y: 0.75,

w: '100%',

h: 1.5,

align: 'center',

fontSize: 24,

color: 'fff',

fill: '000'

}

slide2.addText("JOHN WILLIAMSON LATHAM IS THE CAPTAIN OF NEW ZEALAND",opts1)

let slide3 = pptx.addSlide();

// Image from remote URL

slide3.addImage({

path:"https://cdn.pixabay.com/photo/2014/05/26/13/32/butterfly-354528__340.jpg",

x: "15%",

y: "1%",

h: "75%",

w: "75%"

});

pptx.writeFile();

</script>

Related posts:

You Might Also Like

jsPDF Tutorial to Add Text After Tables inside PDF Document Using jspdf-autotable Library in Javascript

Build a HTML5 CSS3 Image Magnifier to Zoom Images on Mouse Hover in Vanilla Javascript Full Project For Beginners

Node.js Gulp Plugin to Convert Images to Base64 Code on Command Line in Javascript Full Project For Beginners

Leave a Reply Cancel reply