使用插件 pptxgen 导出pptx

pptxgen 官方文档 地址
需求：页面文字，表格，图片导出ppt；

 let pptx = new pptxgen();
 	// 个人理解是设置每张幻灯片的大小
   pptx.defineLayout({name: 'A3', width: 10, height: 7.5});//设置名字 宽 高
   pptx.layout = 'A3';//应用
	// 添加幻灯片
   let slide = pptx.addSlide();
   // 设置这张幻灯片的背景图片
   slide.background = { data: Base64Image.backGround };

添加文字

/*
 * pptx 上面new pptxgen()
 * slide 当前幻灯片：
 * y 当前高度 ：默认第一次高度是0.8
 * text 需要加的文字
 */

function pptAddText(pptx,slide,y=0.8,text,bottom,option={}){
  let rowH = 0.2
  // 根据测试得出上面自定义的布局一行可以有46个字，根据总字数算出要占的高度
  let titleH = Math.ceil(text.length/46)* rowH
  if((y+titleH)<7.4){
    let options={ x:1,y:y,w:"80%",h:titleH,valign:"top", fontFace:"宋体"}
    Object.assign(options,option)
    slide.addText(text,options);
    y += (titleH+bottom) // 下次开始的纵坐标
    return {y,slide}
  }else if(titleH>(4*rowH) && y<7){ // 要添加的文字超过4行，并且页面最少还能装下2行
  	// 当前页面装一部分再新加幻灯片，要不这张太空了
    let minRow = Math.floor((7.4 -  y)/rowH)  // 当前页面最少能装多少行
    let options={ valign:"top",x:1,y:y,w:"80%",h:minRow*rowH, fontFace:"宋体"}
    Object.assign(options,option)
    slide.addText(text.substring(0,minRow*46),options);
    let newslide = addSlide(pptx)
    return pptAddText(pptx,newslide,0.5,text.slice(minRow*46),bottom,option)
  }else{
    // 这个装不下了，新添加一张
    let newslide = addSlide(pptx)
    return pptAddText(pptx,newslide,0.5,text,bottom,option)
  }
}

添加表格

// 从dom元素中获取单元格所占行列及内容，如果直接添加dom元素不能给每个单元格赋予样式
function pptAddTable(pptx,slide,y=0.8,dom,rows=[]){
  let tabRows=[]
 if(!rows.length){
   //*****************表头行*****************************************
   let domHeader = dom.getElementsByClassName('vxe-header--row')
   for(let i=0,len=domHeader.length;i<len;i++){
     let th= domHeader[i].getElementsByTagName('th') // // 表头第i个tr的th
     let count = th.length
     let row = []
     for(let j=0;j<count;j++){
       let show = (th[j].style.display!=="none" && th[j].classList.value.indexOf("header_merge_col")< 0 )
       let rowSpan = th[j].rowSpan
       let colSpan = th[j].colSpan
       if(show){
         let cell ={text:th[j].innerText,options:{colspan:colSpan,rowspan:rowSpan,color:"ffffff",fill:{color:"086FAA"}}}
         row.push(cell)
       }
       if(th[j]._prevClass.indexOf('col--last') >-1 )j=count
     }
     tabRows.push(row)
   }

   //*****************表主体行*****************************************
   let domBody = dom.getElementsByClassName('vxe-body--row')
   for(let i=0,len=domBody.length;i<len;i++){
     let row = []
     let td= domBody[i].getElementsByTagName('td') // // 表主体第i个tr的td
     for(let j=0,len=td.length;j<len;j++){
       let show = (td[j].style.display!=="none" && td[j].classList.value.indexOf("header_merge_col")< 0)
       let rowSpan = td[j].rowSpan
       let colSpan = td[j].colSpan
       let rowColor = ((i%2) ===0 )?"CCD5E2":"E7EBF1"  //
       if(show){
         let cell ={text:td[j].innerText,options:{colspan:colSpan,rowspan:rowSpan,fill: { color: rowColor }}}
         row.push(cell)
       }
     }
     tabRows.push(row)
   }
 }
 else tabRows=rows
  let rowH = 0.5 // 行高
  let fontSize = 8 // 字体大小
  let tabH = tabRows.length * rowH // 表格高度
  if((y+tabH)<7.4){
    slide.addTable(tabRows, {y,fontSize, w: "90%", align: "center", valign: "middle", border: { pt: "1",color:"ffffff"  },h:tabH,rowH});
    y = y+ (tabRows.length*rowH)
    return {y,slide}
  }else if(tabH> (4*rowH) && y< (7.4 - (4*rowH))){ // 超过4行
    let minRow = Math.floor((7.4 -  y)/rowH)// 当前页面最少能装多少行
    slide.addTable(tabRows.slice(0,minRow), {y,fontSize, w: "90%", align: "center", valign: "middle", border: { pt: "1",color:"ffffff" },h:minRow.length*rowH,rowH});
    let newslide = addSlide(pptx)
    return pptAddTable(pptx,newslide,0.5,dom,tabRows.slice(minRow))
  }else{
    let newslide = addSlide(pptx)
    return pptAddTable(pptx,newslide,0.5,dom,tabRows)
  }
}

实现