当前位置:   article > 正文

开源在线excel编辑器_Excel?再见!国产开源在线表格走红~

开源excel在线编辑器

有的同学可能用过不少在线文档编辑器,比如金山文档,腾讯文档,石墨文档,谷歌doc,这些文档要么未开源,要么收费。

那么,有没有一款开源且免费的产品供我们使用呢?是有的,那便是今天的主角——Luckysheet,开源且免费,功能强大,配置简单。

跟往常一样,咱们先来看效果,见下图:

71535a347bc33f230b9dfc04c60b1f5e.gif

是不是跟咱们平常用的Excel一样,没啥差别~

基本上具备了大部分Excel的功能,比如格式调整,公式使用,图表等等,但是,它还有一些特有的功能,比如:

  • 矩阵计算;

  • 对选取进行截图;

  • 支持复制为json、array、对角线数据、去重等;

  • 支持密码、水印、公式等的本地导入导出;

  • 支持JPG,PNG,SVG,Pen tool的插入、修改和删除,并且随表格的变动而产生变化;

  • 数据验证,单元格内其它特有的样式;

该项目是基于Javascript编写的,主要依赖于Node.js的开发环境。正由于它这一特性,更加方便它集成其它的前端组件,比如Luckyexcel、chartMix等。

接下来,说说它的设计思路

老鬼也去看了一些代码,说实话老鬼的js水平有限,但还是能看懂一部分,代码结构挺清晰的,感兴趣的同学也可以去读读,见下图:

48a3f67012171bd55758266ffcaee87a.png

其实咱们看到的一个完整的Luckysheet文件,就表示一张表格,里面包含了若干个sheet文件,sheet文件里面包含具体的表格数据,见下图

6e52b5f7f2f7a7c17056647641a320f9.png

如果你懂点技术的话,可以打开Chrome的Console,输入如下的代码:

luckysheet.getluckysheetfile()

再来看看下面这张图,便一目了然了,见下图

5a9c89a3840682de317a8da25463179e.png

最终,根据用户的操作,组装成之前设计的数据结构来保存起来。思路不难,难得是效果~

如何使用?

1、引入依赖

目前,有两种方案进行引入,具体如下:

1)CDN

这是最快得方案,直接在你的html页面添加如下代码:

2)本地引入

需要进行自行构建,把生成的js文件复制到你的项目中,进行引入,如下:

2、指定表格容器

很简单的,具体代码如下:

3、创建表格

这里,需要通过js来创建一个表格,代码如下:

    $(function () {//配置项var options = {container: 'luckysheet' //luckysheet为容器id        }        luckysheet.create(options)    })

这样,基本上一个表格便可在你指定的页面生成了,是不是很easy,很方便~

目前,该项目在Github上面有5.3k的关注,见下图:

6b1162a4b364db1a024735e16aabc1f5.png

官方地址:https://github.com/mengshukeji/Luckysheet

确实是一个不错的项目,老鬼准备后面抽时间也引入到自己公司的项目中,反正经过老鬼推荐过的项目或者工具,基本都会大火,笔芯~

3c6a28331c047abf1fb61183ec99b7f0.png

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/weixin_40725706/article/detail/396018
推荐阅读
相关标签
  

闽ICP备14008679号