工具.国内开源电子表格-Luckysheet(在线excel

国内开源电子表格-Luckysheet(在线excel,功能强大) – 【剪辑之家】

1、背景

现在web技术蓬勃发展,办公应用特别是excel都搬到了线上,比较流行的有腾讯文档,金山文档,石墨文档,google doc,这些都属于企业服务。但是小型企业或者团队,如果想自己搭建一套在线表格系统呢?有没有开源的方案?

当然是有的,一些表格具有相对简单的功能,只能显示数据和过滤器功能,或者某些表格支持多种单元格样式,但是此类功能需要付费。比较出名有spreadjs,handsontable,这两个插件有明显的缺点,spreadjs增值功能收费太贵,handsontable二次开发坑很多。

Luckysheet ,是一款国产的纯JS实现的类似excel的在线表格,功能强大、配置简单、完全开源。

Luckysheet是用纯JavaScript编写的前端表格库,可以嵌入到任何前端项目或应用程序中,增强原有的系统功能,而无需使用excel或其他复杂的软件进行数据处理。

这使我们的数据处理、分析、显示和存储可以由一个系统完成,而无需切换平台,不切换系统,便于集成和完全自动化。

2、介绍

“我们决心制作一个功能最丰富,配置和使用最简单的开源电子表格-Luckysheet,为企业报表平台和数据分析平台提供支持,并建立一个数据分析社区。具体来说,我们提供了一个类似于excel的在线编辑表格,其中包含单元格样式,公式,过滤,冻结和其他功能。我们基本支持excel的常用功能,数据分析,显示和编辑的需求。” —Luckysheet作者

Luckysheet ,是一款国产的纯JS实现的类似excel的在线表格,功能强大、配置简单、完全开源。

开源地址:https://gitee.com/mengshukeji/Luckysheet

在线文档:https://mengshukeji.github.io/LuckysheetDocs/zh/guide

在线演示:https://mengshukeji.gitee.io/luckysheetdemo

导入导出excel: https://mengshukeji.gitee.io/luckyexceldemo/

3、基本使用

要使用LuckySheet,有2种方式,可以从官网下载JS,然后引入本地页面,也可以引入CDN。

3.1 引入JS

3.2 置放Excel容器

3.3 初始化Excel

这样,一个在线Excel就完成了。LuckySheet只提供前端的操作,数据保存要由开发人员自己实现。

3.4 数据保存

数据保存分为两种,一种是:实时保存,一种是“全部保存”。实时保存比较复杂,现在介绍一种简单的全部保存方法。

LuckySheet提供了一个 luckysheet.getAllSheets() 方法,调用此方法,Luckysheet系统会把所有数据一股脑的传递给你,你可以再页面的OnClick的保存事件里保存这些数据,然后利用Jquery的Post方法,接收数据写入数据库。

下面代码演示了把Luckysheet POST到 xls.aspx 页面

  1. function save() { var data2 = luckysheet.getAllSheets(); var cnt = JSON.stringify(data2); $.post("xls.aspx", { cnt: cnt }); }

在 xls.aspx页面,利用 Request[“cnt”] 就可以获取所有数据,然后保存到数据库。

3.5 数据还原

LuckySheet提供了loadUrl属性,当前端初始化完毕后,luckysheet会调用此属性加载初始化数据。所以,利用此属性,可以还原数据库里保存的数据。

  1. var options = { container: 'luckysheet', lang: 'zh', showinfobar: false, row: 20, column: 15, plugins: ['chart'], showstatisticBar: false, loadUrl: 'data.aspx id=11', //还原数据URL showsheetbar: false, showsheetbarConfig: { add: false, menu: false, }

4、数据缓存

(1) Luckysheet允许在本地加载Luckysheet需要的JS,CSS等,但是这些JS、CSS比较大,为此,可以利用link的prefetch预加载CSS,JS。

(2)Luckysheet在插入图片时,图片会议Base64格式存储,所以,最终保存的数据可能非常大。

(3)需要理解Excel的一些简单概念:一个Excel是由多个Sheet组成,而一个Sheet是由多个Cell组成,而每个单元格都会包括 r,c,v(r:单元格的行 row、c:单元格的列 column、 v:单元格的值 value),在使用实时保存时, 二维数组数据转化成 {r, c, v}格式 一维数组。实时保存数据量小,但是比较复杂。

5、导入导出

LuckySheet提供了一个LuckyExcel,他支持Excel的导入和导出。

演示:https://mengshukeji.gitee.io/luckyexceldemo

6、生成图表

Luckysheet可以使用Echart生成图表组件(饼形图,柱状图,曲线图等)。

查看全文

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.dgrt.cn/a/2202438.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章:

工具.国内开源电子表格-Luckysheet(在线excel)

国内开源电子表格-Luckysheet(在线excel,功能强大) – 【剪辑之家】
1、背景
现在web技术蓬勃发展,办公应用特别是excel都搬到了线上,比较流行的有腾讯文档,金山文档,石墨文档,google doc,这些……

Shell 输入输出重定向

1 普通重定向
命令说明command > file将输出重定向到 file。command < file将输入重定向到 file。command >> file将输出以追加的方式重定向到 file。n > file将文件描述符为 n 的文件重定向到 file。n >> file将文件描述符为 n 的文件以追加的方式重定向……

禁用Windows Defender – Win10

禁用Windows Defender – Win10前言方案1:临时关闭方案2:第三方安全软件方案3:组策略关闭方案4:注册表关闭方案5:小工具关闭前言
Win10自带的Windows Defender有时会造成不少麻烦,最大的问题是它不会在删除……

进制的相互转换 Java

十进制转其他进制 public class Main {public static void main(String[] args) {int n 18;Integer.toHexString(n);System.out.println(n "的二进制是:" Integer.toBinaryString(n));System.out.println(n "的八进制是:" Integer.toOctalString(n));……

【C++】开散列哈希表封装实现unordered_map和unordered_set

在未达成目的之前,一切具有诱惑力的事物都显得那么不堪一击 文章目录一、unordered系列关联式容器二、哈希函数和哈希冲突三、闭散列(你抢我的位置,我抢他的位置)1.哈希表结构2.Insert()3.Erase()(标记的伪删除法&……

vscode设置选中代码自定义高亮颜色

vscode设置选中代码自定义高亮颜色
按照如下步骤,点击步骤3的小图标,进入settings.json 在文件的末尾填充如下代码 "workbench.colorCustomizations": {"editor.selectionBackground": "#62CDFF"}就像是这样 其中"……

mongodb文档操作——查询

mongodb文档操作——查询mongodb文档操作——查询基本查询准备数据1. 查询所有的员工信息。2. 查询职位为经理的员工。3. 查询MANAGER或者CLERK员工信息,分别用$in和$or完成。4. 查询10号部门工资大于2000的员工。5. 查询仅显示员工的姓名和部门信息这两个字段。嵌套……

ChatGPT为何如此强大-如何让chatGPT写代码

专家谈ChatGPT对话水平
ChatGPT 是一种基于深度学习的自然语言处理技术,能够处理和理解大量的自然语言数据,通过训练能够进行对话等多种自然语言处理任务。但是,在实际对话中,ChatGPT 的对话水平仍有一些不足之处: 对……

双指针算法+例题

例1:日志统计(第九届蓝桥杯省赛CB组)
题目描述
小明维护着一个程序员论坛。现在他收集了一份"点赞"日志,日志共有 N 行。其中每一行的格式是: ts id 表示在 ts 时刻编号 id 的帖子收到一个"赞"。……

STM32CubeMXA安装和创建项目

STM32CubeMXA安装和创建项目
安装STM32CubeMXA
STM32CubeMX 运行环境搭建包含两个部分。首先是 Java 运行环境安装,其次是 STM32CubeMX 软件安装。
安装 JAVA 环境
对于 Java 运行环境,大家可以到 Java 官网 www.java.com 下载最新的 Java 软件 安装……

反序列化渗透与攻防(五)之shiro反序列化漏洞

Shiro反序列化漏洞
Shiro介绍
Apache Shiro是一款开源安全框架,提供身份验证、授权、密码学和会话管理。Shiro框架直观、易用,同时也能提供健壮的安全性
Apache Shiro 1.2.4及以前版本中,加密的用户信息序列化后存储在名为remember-me的Cookie中。攻击者可以使用Shiro的默……

vue2+vue3

vue2vue3尚硅谷vue2vue2 课程简介【02:24】vue2 Vue简介【17:59】vue2 Vue官网使用指南【14:07】vue2 搭建Vue开发环境【13:54】vue2 Hello小案例【22:25】了解: 不常用常用:id 更常用 简单class差值总结vue 实例vue 模板 : 先 取 &#xff0……

【hello Linux】环境变量

目录 1. 环境变量的概念 2. 常见的环境变量 3. 查看环境变量 4. 和环境变量相关的命令 5. 环境变量的组织方式 6. 通过代码获取环境变量 7. 通过系统调用获取环境变量 Linux🌷 在开始今天的内容之前,先来看一幅图片吧! 不知道你们是否和我一……

【Linux基础】常用命令整理

ls命令
-a选项,可以展示隐藏的文件和文件夹-l选项,以列表形式展示内容-h,需要和-l搭配使用,可以展示文件的大小单位ls -lah等同于la -a -l -h
cd命令(change directory)
语法:cd [Linux路径]……

客快物流大数据项目(一百一十二):初识Spring Cloud

文章目录
初识Spring Cloud
一、Spring Cloud简介
二、SpringCloud 基础架构图…

C和C++中的struct有什么区别

区别一: C语言中: Struct是用户自定义数据类型(UDT)。 C语言中: Struct是抽象数据类型(ADT),支持成员函数的定义。
区别二:
C中的struct是没有权限设置的&#xff0c……

docker的数据卷详解

数据卷 数据卷是宿主机中的一个目录或文件,当容器目录和数据卷目录绑定后,对方修改会立即同步
一个数据卷可以同时被多个容器同时挂载,一个容器也可以被挂载多个数据卷
数据卷作用:容器数据持久化 /外部机器和容器间接通信 /容器……

13、Qt生成dll-QLibrary方式使用

Qt创建dll,使用QLibrary类方式调用dll
一、创建项目
1、新建项目->其他项目->Empty qmake Project->Choose 2、输入项目名,选择项目位置,下一步 3、选择MinGW,下一步 4、完成 5、.pro中添加TEMPLATE subdirs&#xff……

基于mapreduce 的 minHash 矩阵压缩

Minhash作用: 对大矩阵进行降维处理,在进行计算俩个用户之间的相似度。
比如: 俩个用户手机下载的APP的相似度,在一个矩阵中会有很多很多的用户要比较没俩个用户之间的相似度是一个很大的计算任务 如果首先对这个矩阵降维处理&am……

关于hashmap使用迭代器的问题

keySet获得的只是key值的集合,valueSet获得的是value集合,entryset获得的是键值对的集合。 package com.test2.test;import java.util.HashMap;
import java.util.Iterator;
import java.util.Map;
import java.util.Map.Entry;public class mapiterator……

Published by

风君子

独自遨游何稽首 揭天掀地慰生平

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注