Spread JS 怎样实现将chart导出为图片

大家知道，SpreadJS中的chart无法脱离SpreadJS单独展示，有时需要能够让用户看到图表，但不需要加载整个表格，这时可以考虑用生成图片的方式保存图表。
本文介绍怎样把SpreadJS中的图表转为base64格式的字符串，供我们接下来使用。

一、获取所有chart的渲染结果：
SpreadJS的chart是浮动对象的一种，浮动对象是按需加载的，所以要批量生成chart的图片，必须先激活它们。

1. // 需要激活图片的渲染，然后再执行导出
   
2.         spread.bind(GC.Spread.Sheets.Events.FloatingObjectLoaded, function (e, info) {
   
3.                 var sheet = info.sheet;
   
4.                 var floatingObject = info.floatingObject;
   
5.                 var canvas = $(floatingObject.getHost()).find("canvas")[0]
   
6.                 if(canvas){
   
7.                         var image = new Image()
   
8.                         image.src = canvas.toDataURL("image/png")
   
9.                         //console.log(image.src);
   
10.                         pics.push(image.src);
    
11.                 }
    
12.         });

复制代码

二、把激活的chart中的canvas获取到后，转为image对象，生成base64：

1. $("#convert").click(function(){
   
2.                 var sheet = spread.getActiveSheet();
   
3.                 var chart = sheet.charts.all()[0]
   
4.                 var canvas = $(chart.getHost()).find("canvas")[0]
   
5.                 var image = new Image()
   
6.                 image.src = canvas.toDataURL("image/png")
   
7.                 console.log(image.src);
   
8.                 alert("操作完成，请查看控制台");
   
9.         })
   
10.        

复制代码

完整实例参考附件。