DataGear 內置表格圖表底層采用的是DataTable表格組件，默認并未引入導出數據的JS支持庫，如果有導出表格數據需求，則可以在看板中引入導出相關JS支持庫，制作具有導出CSV、Excel、PDF功能的表格數據看板。
在新發布的5.3.0版本中，對表格功能進行了改進，在制作具有導出功能表格的看板時，僅需要引入jszip.js、pdfMake.js、vfs_fonts.js庫即可。
如果不需要導出PDF，則不需要引入
pdfMake.js、vfs_fonts.js庫
首先，新建表格圖表看板，例如：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="display:inline-block;width:100%;height:500px;"dg-chart-widget="..."></div>
</body>
</html>
然后，下載如下導出JS支持庫：
https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js
https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js（僅導出PDF時需要）
https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js（僅導出PDF時需要）
并將它們上傳為看板資源，例如：
lib/|--jszip.min.js|--pdfmake.min.js （僅導出PDF時需要）|--vfs_fonts.js （僅導出PDF時需要）最后，在看板中引入上述JS庫，配置表格圖表導出按鈕即可，例如：
<!DOCTYPE html>
<html>
<head>
<script src="lib/jszip.min.js"></script>
<script src="lib/pdfmake.min.js"></script> <!--僅導出PDF時需要-->
<script src="lib/vfs_fonts.js"></script> <!--僅導出PDF時需要-->
<style>
/*自定義導出按鈕樣式*/
.dt-buttons button.dt-button{padding: 0.2em 1em;color: green;
}
</style>
</head>
<body>
<div style="display:inline-block;width:100%;height:500px;"dg-chart-options="{buttons:[{extend:'csv',text:'導出CSV'},{extend:'excel',text:'導出Excel'},{extend:'pdf',text:'導出PDF'}, /*僅導出PDF時需要*/{extend:'print',text:'打印'}]}"dg-chart-widget="..."></div>
</body>
</html>
效果圖如下所示：
使用下面的
dg-chart-options可以自定義導出/打印標題、文件名
{buttons:[{extend:'csv',text:'導出CSV', filename: 'csv'},{extend:'excel',text:'導出Excel', filename: 'excel', title: null},{extend:'pdf',text:'導出PDF', filename: 'pdf', title: null}, /*僅導出PDF時需要*/{extend:'print',text:'打印', title: 'Title'}]
}
官網地址：
http://www.datagear.tech
源碼地址：
Gitee：https://gitee.com/datagear/datagear
Github：https://github.com/datageartech/datagear
GitCode：https://gitcode.com/datageartech/datagear
 詳細分析)
