欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

echarts图表导出excel示例

程序员文章站 2024-02-28 14:39:22
根据传入的参数生成相应的图形 复制代码 代码如下:loadchart : function(data,item){  var that = this;...

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

复制代码 代码如下:

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'
         }
     });
 }

将数据传递到后台

复制代码 代码如下:

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(';'));
 }

解析base64,生成图片

复制代码 代码如下:

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;
        }
 }

通过poi画图,将图片放入到excel中

复制代码 代码如下:

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();
  }