SpreadJS集算表联动数据透视表,高效实现前端数据多维分析

news2024/11/25 3:01:42

在做一些财务、供应链、资产管理等系统时,由于业务人员线下都是采用Excel来完成的,因此就需要将Excel中业务人员使用的功能都能在Web端系统实现,整体上的实现方案有三种:

  1. 完全自研一套具备Excel功能的组件;
  2. 使用成品软件,例如office 365,Wps,等;
  3. 使用类Excel控件;

在实际调研中发现,采用方案一,自研成本过高,例如Excel中每一种公式函数的实现,跨工作表计算链路分析等等,这些在实现上都有较大的难度。其次就是,自研系统的操作习惯不一定与Excel类似,导致后续业务人员在使用时,需要一定的培训成本。

方案二对原有Excel功能不再需要研发投入,但由于软件类具有较强的封装性,而实际Web系统中的业务需求又需要能结合实际的应用场景做一些定制化功能。最常见的就是表单保护,软件类和权限对接时,最小粒度只能控制到表单级别,无法做到控制当前用户下,不能编辑某几个单元格。软件的高封装性无法应对系统中大量的定制化需求。

相对来说,选择类Excel控件是最完美的策略了,它不需要研发人员自研Excel的功能,又提供了大量的API支持扩展开发。

SpreadJS是一款纯前端类Excel表格控件,支持前端主流框架,可轻松嵌入自己的Web系统中。作为一款类Excel表格控件,SpreadJS天然具备Excel的大部分功能,例如数据验证、条件格式、图形图表、公式函数、透视表等等。除此之外,为了便于Web系统的数据设置和提取,SpreadJS也提出了数据绑定及集算表等方式,来简化开发成本。本文围绕数据设置及分析,整合SpreadJS中集算表及数据透视表功能,提供一种纯前端高效能数据多维分析方案。

SpreadJS与框架集成方式可参考下面的文章:

  1. Vue集成SpreadJS;
  2. React集成SpreadJS。

Web系统中,要对数据做分析处理,首先需要将要做分析处理的数据查询到前端。SpreadJS中,集算表是一个具有网状行为和电子表格用户界面的快速数据绑定视图,可以对接具体的API接口,实现数据的增删改查。API层面实现可参考学习指南-集算表,UI层面的操作可以参考下面的视频教程:

  1. 集算表数据自动同步;
  2. 集算表数据批量提交。

本文侧重做数据分析,可以暂时只关注集算表数据查询接口,SpreadJS在线体验地址中,创建集算表时,提供了默认的数据查询接口。本文中,测试接口由Postman模拟生成,对应的接口为“https://9a288081-e4c6-4468-8228-b2fefad890c1.mock.pstmn.io/getOrder”,返回数据字段为“list”,创建集算表的过程如下:

创建完集算表之后,本身集算表就具备一定的分析统计能力,可以通过分组,求和函数来实现部分数据分析与统计:

但这种数据统计分析如果相对数据透视图来说,设置方式略微复杂,并且与Excel使用方式并不一致,对业务人员来说,存在一定的挑战。我们可以将集算表用来做数据展示的快捷手段,后续的数据分析依然借助生成透视表来完成,SpreadJS基于计算表,可直接创建数据透视表:

使用这种方案,我们就可以快速的对接数据,在纯前端的环境下实现数据分析及统计需求。

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

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

相关文章

Linux-tar打包与解压命令

tar命令位于/bin目录下,它能够将用户所指定的文件或目录打包成一个文件,但不做压缩。一般Linux上常用的压缩方式是选用tar将许多文件打包成一个文件,再以gzip压缩命令压缩成xxx.tar.gz(或称为xxx.tgz)的文件。 常用参数: -c&a…

布隆过滤器【美与不美之谈】

什么是布隆过滤器 布隆过滤器其实本质上来讲就是一种巧妙的数据结构,特点就是高效的插入和查询。 它能告诉我们:什么一定不存在,或者什么可能会存在 总结:布隆过滤器是概率性的。它只能告诉我们什么一定不存在,或者…

科技向“实”万物生长,2023年云计算五大技术趋势展望

科技云报道原创。 近日,全球最大的专业技术组织IEEE(电气电子工程师学会)发布了《IEEE全球调研:科技在2023年及未来的影响》。根据相关调研显示,云计算(40%)、5G(38%)、元宇宙(37%)将成为影响2023年最重要的技术,其中云计算位居首…

算法---模拟(2)

目录 一、模拟算法题目 (1)神奇的幻方 (2)Proceting the Flower (3)排座椅 (4)国王的游戏 (5)字典序最大的子序列 一、模拟算法题目 (1&…

Spring源码下载

一、Spring | Home 二、Projects->Spring Framework 三、点击小猫图片进入Spring Framework的代码仓 四、选择感兴趣的分支

如何实现高性能点赞(二)

1.3 Redis 的数据结构类型 Redis 可以存储键与5种不同数据结构类型之间的映射,这5种数据结构类型分别为String(字符串)、List(列表)、Set(集合)、Hash(散列)和 Zset&…

Mac M2芯 超详细k8s集群实战 - kubeadm

概述 我们准备搭建kubeadm的masterworker集群,实现k8s集群,master、worker在虚拟机上来执行,中间遇到了超级多的坑,都搞定了之后,在这里系统的总结一下,这也是一篇学习笔记。 这篇比较难搞,如…

【网络安全】Fastjson的反序列化漏洞复现

1.漏洞概述 Fastjson提供了autotype功能,允许用户在反序列化数据中通过“type”指定反序列化的类型,Fastjson自定义的反序列化机制时会调用指定类中的setter方法及部分getter方法,那么当组件开启了autotype功能并且反序列化不可信数据时&…

qt简单UI使用

geometry设置窗口大小 font字体大小 text改文件名

本地使用隧道或代理访问云服务器数据库

本地使用代理访问云服务器数据库 场景: 项目的测试环境是部署至云服务器上的,有时候云服务器的项目测试出现了一些问题,为了方便复现就在本地直连云服务器的数据库(mysql服务器)。但是云服务器是有三台机子&#xff0…

性能测试工程师技术履历表

技术履历表 基本情况 姓名 XXX 年龄 26 性别 男 工作年限 3-4 岗位 性能测试工程师 毕业院校和专业 武汉软件工程职业学院 学历 大专 技能评价 1、熟悉基于Http,TCP等协议的脚本开发。 2、 熟练掌握:Loadrunner等压测工具。 3、 掌握Linu…

Echosync 一款优秀的文件夹同步和备份软件

Echosync 一款优秀的文件夹同步和备份软件 通过执行差异数据备份、文件同步,这样可以避免传递自上次备份以来所做的更改,Echosync能够检测到移动或重命名自上次备份的文件。 下载 Echosync 软件介绍 VHD中备份文件 你的文件可以保存到单个 VHD 文件…

RK3568 ov5695摄像头

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录前言一、什么是mipi接口?二、摄像头是如何把数据给到RK3568,又是如何处理硬件连接关系图:图像数据的来龙去脉代码路径三、如何移植修改设备树…

高通开发系列 - 数字和模拟codec驱动

By: fulinux E-mail: fulinux@sina.com Blog: https://blog.csdn.net/fulinus 喜欢的盆友欢迎点赞和订阅! 你的喜欢就是我写作的动力! 目录 MSM89XX音频硬件框架Linux kernel驱动LPASS的地址空间PM和PMI的区别PM8953简介Slave ID从设备idPM89xx中的模拟codec驱动准备codec的驱…

进程退出与等待

1️⃣ 进程退出 正常终止 main函数的返回调用exit_exit 异常终止 Ctrl c (信号终止) 1.main函数的返回就是return 0;程序退出这个在高级语言里面就学过了不多说。 2.exit(x)的使用如下 第一次测试:错误码与main函数里面打印的值。 第二次测试&#xf…

[oeasy]python0033_任务管理_jobs_切换任务_进程树结构_fg

查看进程 回忆上次内容 上次先进程查询 ps -elf 查看所有进程信息ps -lf 查看本终端相关进程信息 杀死进程 kill -9 PID 给进程发送死亡信号 运行多个 python3 show_time.py 的话 各个进程独立python3 show_time.py 大概 8M各占内存这些进程之间是什么关系呢?&…

秦海璐、宋轶现身,岳云鹏孙越成谜,央视春晚第一次彩排姗姗来迟

最近一段时间,全国各地的朋友都在积极行动,都想推迟成为小阳人的时间,却险些忘了一件大事。伴随着春节的临近,每年的央视春晚都倍受期待,今年当然也不例外,可是却一直没有央视春晚的消息。 就在大家都认为&…

利用adb查找手机定位,并且打开地图定位

可以使用 Android Debug Bridge (ADB) 工具来查找手机的位置信息。 首先,您需要确保手机已连接到电脑(内网穿透或者搭建虚拟局域网),并且已在手机上启用 USB 调试。然后,您可以在电脑的命令提示符下使用 ADB 命令来查询…

小程序框架

目录 一,框架 二,响应的数据绑定 三,页面管理 四,基础组件 逻辑层 App Service 五,小程序的生命周期 六,注册页面 1.使用 Page 构造器注册页面 2.在页面中使用 behaviors 3.使用 Component 构造器…

[HAL库]STM32 ADC功能和DMA读数据的方法

这篇博客记录下 STM32F103R8T6 是怎么开ADC、用DMA搬数据的方法。方便日后使用的时候查资料。 DMA其实就是个搬运工,专门负责搬数据,没有DMA之前,搬数据是由MCU核心来负责,虽说都能完成搬数据的动作,但是MCU干这件事浪…