[发明专利]一种基于Echarts的大量数据图形显示方法

说明书

本发明公开了一种基于Echarts的大量数据图形显示方法，用数据采集系统每秒从设备采集数据存储至数据库；网页前端发送多个并发请求；后端系统根据并发请求内容从数据库查询数据，将查询的数据压缩返回给网页前端；网页前端接收后端系统的查询数据，根据查询数据生成Echarts参数配置项，并将查询数据传递给Echarts组件；后端系统每返回一次查询数据，网页前端立即异步接收，并将查询数据添加至Echarts参数配置。由于采集端按秒采集设备数据，数据量巨大，因此网页端的数据展示需采用分段加载、异步加载等优化方法，本发明可实现网页上对百万级的数据实现秒级的展现输出，流畅实现Echarts拖拽筛选等数据功能。

技术领域

本发明属于数据处理技术领域，涉及一种基于Echarts工具的数据可视化显示方法、装置、设备及介质。

背景技术

近年来，数据可视化技术作为高新技术的一种，在大数据时代下显得尤为重要，现已被应用于各领域及场景的数据显示。百度开发的Echarts是优秀的图表展示前端框架，应用该框架能够将分散的监控数据直观的用图表形式展现出来，体现数据的分布，数据的变化历程，数据的相互关联关系等，为决策者提供更低门槛的数据表现，越来越多的数据展现使用Echarts类似的前端图形化展现。但Echarts对于上百万的图形显示需要复杂的参数配置，该复杂程度对于新接触的开发人员是一个很耗时的调试过程，并且其数据传输过程还需后端和数据库开发人员的优化配合，才能快速流畅地显示大量数据。因此缺乏一套用于大量数据图形显示的前后端以及数据采集端处理方法。

发明内容

针对上述技术问题，本发明提供了一种基于Echarts的大量数据图形显示方法。实现网页上对百万级的数据实现秒级的展现输出，流畅实现Echarts拖拽筛选等数据操作功能。

为达到上述目的，本发明采用的技术方案为：一种基于Echarts的大量数据图形显示方法，该方法包括以下步骤：

用数据采集系统每秒从设备采集数据存储至数据库；

网页前端发送多个并发请求；

后端系统根据并发请求内容从数据库查询数据，将查询的数据压缩返回给网页前端；

网页前端接收后端系统的查询数据，根据查询数据生成Echarts参数配置项，并将查询数据传递给Echarts组件；

后端系统每返回一次查询数据，网页前端立即异步接收，并将查询数据添加至Echarts配置项，从而在界面上动态递增地渲染图表。

进一步地，数据采集系统每秒从设备采集数据存储至数据库，存储是以JSON格式存储，JSON数据格式采用以下形式：{vls:[[Time1,Data1],[Time2,Data2],……]}，其中Time为X轴对应的时间位置，Data为Y轴需要展示的数据。调用函数判断当前配置参数的类型，后端程序将数据格式解析成网页前端易转换的格式，网页前端再将其转换成Echarts原生的JSON配置参数；通过该方法存储数据库，从原来的一秒一条，到以JSON格式一小时一条记录，每一行JSON数据包含了上千个数据，减少了数据的索引量，大幅提升数据查询速度。

进一步地，根据并发请求内容，从数据库按索引查询数据，按索引查询数据开始之前开启缓存，当查询完全相同时(逐字节相同)，就不用到数据库中执行查询，而直接调用缓存中的结果，免去了重复的数据检索。

进一步地，生成的Echarts参数配置均为JSON格式的数据，所述参数包括如下的一种或多种：标题组件属性，图例组件属性，系列sampling属性，直角坐标系中的x轴属性，直角坐标系中的y轴属性，区域缩放组件，序列名称属性，序列类型属性，线条样式属性，线条颜色属性，区域填充样式属性，区域颜色属性，数据堆叠属性，线两端的标记类型属性，线两端的标记的显示样式等属性。