更新时间:2020-06-07 22:14:21
基本介绍
Luckysheet ,一款纯前端类似excel的在线表格,功能强大、配置简单、完全开源。
Luckysheet支持表格设置包括冻结行列、合并单元格、筛选、排序、查询、条件格式、批注
支持数据分析功能包括透视表、分列、矩阵操作、内置385个计算函数
支持一键截图、复制为json数据、共享编辑、excel与Luckysheet之间数据的复制粘贴
支持移动端查看
#环境
Node.js Version >= 6
#安装
npm install npm install gulp -g
#开发
npm run dev
#打包
npm run build
第一步
npm run build后dist文件夹下的所有文件复制到项目目录
第二步
引入依赖
<link rel="stylesheet" href="plugins/css/pluginsCss.min.css"> <link rel="stylesheet" href="plugins/plugins.min.css"> <link rel="stylesheet" href="css/main.min.css"> <script src="plugins/js/plugin.min.js"></script> <script src="main.min.js"></script>
第三步
指定一个表格容器
<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div>
第四步
创建一个表格
<script> $(function () { //配置项 var options = { container: 'luckysheet' //luckysheet为容器id } luckysheet.create(options) }) </script>
格式
一个完整的Luckysheet表格文件的数据格式为:luckysheetfile,一个表格表格文件包含若干个sheet文件,对应excel的sheet0、sheet1等。
一个Luckysheet文件的示例如下,该表格包含3个sheet:luckysheetfile = [ {sheet1设置}, {sheet2设置}, {sheet3设置} ] 相当于excel的3个sheet excel sheet
文件中的一个sheet的示例如下:
luckysheetfile[0] = { "name": "超市销售额", "color": "", "chart": [], "status": 0, "order": 0, "celldata": [], "row":90, "column":100, "index": 0, "visibledatarow": [], "visibledatacolumn": [], "rowsplit": [], "ch_width": 4629, "rh_height": 1681, "luckysheet_select_save": {}, "luckysheet_selection_range": {}, "scrollLeft": 0, "scrollTop": 0, "load": "1", "config": { "columlen": {}, "rowhidden": {} } , "pivotTable": {}, "isPivotTable": true, "calcChain": [], "filter":{key1:value1, key2:value2}, "filter_select": {} }
查看方式
在chrome的console中查看 luckysheet.getluckysheetfile() 可以看到完整设置 [{shee1}, {sheet2}, {sheet3}]