dom-to-image截屏，html保存成图片

dom-to-image把dom节点转换为矢量图（svg）和位图（png和jpeg） ，可处理存在滚动条的页面。

dom-to-image下载地址：https://pan.baidu.com/s/1wrClGYO_NCeta2c8MCmb3w  提取密码：rzek

前段代码以下：

// 导出按钮事件
core.exportPic = function(){
   $("#exportExcel").unbind("click").click(function() {
      // 导出Excel
      core.post("xls");
   });
		
   $("#exportPDF").unbind("click").click(function() {
      // 导出成pdf
      core.post("pdf");
   });
}
	
core.post = function(type){
   // 导出节点
   var node = document.getElementById('dbd_view');
   // 导出宽度
   var width = document.body.scrollWidth;
   // 导出高度
   var height = node.scrollHeight;
   var index = layer.load(0, {shade: [0.4,'#fff']}); //0表明加载的风格，支持0-2
   // dom转图片
   domtoimage.toPng(node,{width: width,height: height}).then(function (dataUrl) {
      // 图片数据处理
      dataUrl = dataUrl.split('base64,')[1];
      // 请求后台输出文件
      var url = Design.basePath + '/dataView/dashboard/export.bs';
      $.post(url,{"imgData": dataUrl},function(data){
         layer.close(index);
         // 下载
         var fileName = encodeURI(encodeURI(decodeURI(Design.dbName) + "." + type));
         window.location.href = Design.basePath + '/dataView/dashboard/down.bs?path=' + 
                 data.path + "&name=" + fileName;
      }, 'json');
   });
}

后台生成图片

public void export() throws Exception {
   // 获取图片数据
   String imgData = dtoParam.getString("imgData");
   // 图片数据解析
   BASE64Decoder decoder = new BASE64Decoder();
   byte[] b = decoder.decodeBuffer(imgData);  
   for(int i=0;i<b.length;++i) {  
      if(b[i]<0) {
         //调整异常数据  
         b[i]+=256;  
      }  
   }  
   /* 生成png图片  */
   // 图片生产临时存储位置
   String tempPath = BsConfigFileHelper.getLocalRoot() + BsConfigFileHelper.getLocalTemp();
   String savePath = tempPath + "/" + dbId + ".png";
   File file = new File(tempPath + "/");
   if(!file.exists()) file.mkdirs();
   OutputStream out = new FileOutputStream(savePath);      
   out.write(b);  
   out.flush();  
   out.close();
}