echarts图表导出excel

根据传入的参数生成相应的图形    

var imgObj = myChart.getImage(''png'');//获得img对象
var imgUrl = myChart.getDataURL(''png'');//获得img对象base64编码

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79

loadChart : function(data,item){          var that = this ;          require([ 'echarts' , 'echarts/chart/bar' , 'echarts/chart/line' ,                  'echarts/chart/pie' ], function(ec) {              that.body.setHeight( 800 );              var myChart = ec.init(that.body.dom);              myChart.showLoading({                  text : "图表数据正在努力加载..."              });                                              var option = {                      tooltip : {                          trigger : 'axis' ,                          axisPointer : { // 坐标轴指示器，坐标轴触发有效                              type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'                          }                      },                      legend : {                          data : data.indis,                          x : 'left' ,                          y : 'top'                      },                      toolbox : {                          show : true ,                          orient : 'vertical' ,                          x : 'right' ,                          y : 'center' ,                          feature : {                              mark : {                                  show : true                              },                              dataView : {                                  show : true ,                                  readOnly : true                              },                              magicType : {                                  show : true ,                                  type : [ 'line' , 'bar' , 'stack' , 'tiled' ]                              },                              restore : {                                  show : true                              },                              saveAsImage : {                                  show : true                              }                          }                      },                      calculable : true ,                      animation : false ,                      xAxis : [{                          type : 'category' ,                          data : data.grp                      }],                      yAxis : [{                          type : 'value' ,                          splitArea : {                              show : true                          }                      }],                      series : data.bar.series                  };              }              myChart.hideLoading();              myChart.setOption(option);              that.imgURL = myChart.getDataURL( 'png' ); //获取base64编码          });            }, initEChart : function(){          require.config({              paths:{                  'echarts' : 'js/com/bhtec/echart/echarts' ,                  'echarts/chart/bar' : 'js/com/bhtec/echart/echarts' ,                  'echarts/chart/line' : 'js/com/bhtec/echart/echarts' ,                  'echarts/chart/pie' : 'js/com/bhtec/echart/echarts'              }          });      }

2. [代码]将数据传递到后台    

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33

doExport : function(){                    var url = this .chartPanel.getImageURL();          var title = Ext.fly( 'indi-display-title-id' ).first().dom.innerHTML;          var left = Ext.getCmp( "indi_pivotGrid_id" ).leftAxis.getTuples();          var t = Ext.getCmp( "indi_pivotGrid_id" ).topAxis.getTuples();                    //TODO  获取base64的图片编码          Ext.Ajax.request({              url : 'indicator/exp2excl.mvc' ,              params : {                  imgURL:url,                  left:getS(left)              }          });          function getS(d){              var arr = [],str;              for (var i= 0 ;i<d.length;i++){                  var s = IndiFn.getAxisStr(d[i]);                  arr.push(s);              }              str = arr.join( ',' );              return str;          }          var data = Ext.getCmp( "indi_pivotGrid_id" ).extractData();          var s,arr=[];          for (var i= 0 ;i<data.length;i++){              arr.push(data[i]);          }                window.open( 'indicator/exportList2Excel.mvc?title=' +encodeURIComponent(encodeURIComponent(title))+ '&left=' +encodeURIComponent(encodeURIComponent(getS(left)))+ '' +                  '&top=' +encodeURIComponent(encodeURIComponent(getS(t)))+ '&data=' +arr.join( ';' ));      }

3. [代码]解析base64，生成图片    

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

public void base64TOpic(String fileName, HttpServletRequest req) {          //对字节数组字符串进行Base64解码并生成图片          if (imgsURl == null ) //图像数据为空              return ;          BASE64Decoder decoder = new BASE64Decoder();          try          {              String[] url = imgsURl.split( "," );              String u = url[ 1 ];              //Base64解码              byte [] buffer = new BASE64Decoder().decodeBuffer(u);              //生成图片              OutputStream out = new FileOutputStream( new File(req.getRealPath( "pic/" +fileName+ ".jpg" )));                 out.write(buffer);              out.flush();              out.close();              return ;          }          catch (Exception e)          {              return ;          }      }

4. [代码]通过poi画图，将图片放入到excel中    跳至[1] [2] [3] [4] [全屏预览]

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

row = sheet.createRow(index+ 3 );          HSSFCell headerCell = row.createCell( 0 );             headerCell.setCellType(HSSFCell.CELL_TYPE_BLANK);           headerCell.setCellValue(title);                    row = sheet.createRow(index + 6 );          HSSFCell cells = row.createCell( 0 );          cells.setCellType(HSSFCell.CELL_TYPE_BLANK);          ByteArrayOutputStream outStream = new ByteArrayOutputStream(); // 将图片写入流中          BufferedImage bufferImg = ImageIO.read( new File(req.getRealPath( "pic/" +fileName+ ".jpg" )));          ImageIO.write(bufferImg, "PNG" , outStream); // 利用HSSFPatriarch将图片写入EXCEL          HSSFPatriarch patri = sheet.createDrawingPatriarch();          HSSFClientAnchor anchor = new HSSFClientAnchor( 5 , 5 , 5 , 5 ,                  ( short ) 1 , index + 6 , ( short ) 6 , 45 );          patri.createPicture(anchor, workbook.addPicture(                  outStream.toByteArray(), HSSFWorkbook.PICTURE_TYPE_PNG));          try {              workbook.write(out);              out.flush();              out.close();          } catch (IOException e) {              e.printStackTrace();          }