首页> 中国专利> 一种基于ECharts的住房公积金数据展示方法和装置

一种基于ECharts的住房公积金数据展示方法和装置

摘要

本发明公开了一种基于ECharts的住房公积金数据展示方法和装置,涉及数据可视化领域。该方法的一具体实施方式包括:基于ECharts,生成住房公积金数据对应的展示网页,其中,展示网页包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域;设置各展示区域的数据展示形式,其中,数据展示形式包括:轮播播放、动态效果展示;按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据。该实施方式解决了当前展示形式比较单一的问题,给用户带来较好的视觉效果,能够展示数据的实时转移情况,达到了较好的数据展示效果。

著录项

  • 公开/公告号CN112926005A

    专利类型发明专利

  • 公开/公告日2021-06-08

    原文格式PDF

  • 申请/专利权人 中国建设银行股份有限公司;

    申请/专利号CN202110336799.1

  • 申请日2021-03-29

  • 分类号G06F16/957(20190101);G06F16/958(20190101);

  • 代理机构11219 中原信达知识产权代理有限责任公司;

  • 代理人王安娜;王志远

  • 地址 100033 北京市西城区金融大街25号

  • 入库时间 2023-06-19 11:19:16

说明书

技术领域

本发明涉及数据可视化领域,尤其涉及一种基于ECharts的住房公积金数据展示方法和装置。

背景技术

住房公积金是指国家机关、国有企业、城镇集体企业、外商投资企业、城镇私营企业及其他城镇企业、事业单位、民办非企业单位、社会团体及其在职职工缴存的长期住房储金。

由于工作变动、居住地变动等原因,越来越多的用户需要转移住房公积金。当前,与转移业务相关的数据的展示形式比较单一,而且不能实时展示数据的转移情况,难以达到较佳的数据展示效果。

发明内容

有鉴于此,本发明实施例提供一种基于ECharts的住房公积金数据展示方法和装置,能够解决当前展示形式比较单一的问题,给用户带来较好的视觉效果,能够展示数据的实时转移情况,达到了较好的数据展示效果。

为实现上述目的,根据本发明实施例的一个方面,提供了一种基于ECharts的住房公积金数据展示方法。

本发明实施例的基于ECharts的住房公积金数据展示方法,包括:基于ECharts,生成住房公积金数据对应的展示网页,其中,所述展示网页包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域;设置各展示区域的数据展示形式,其中,所述数据展示形式包括:轮播播放、动态效果展示;按照所述各展示区域的数据展示形式,在所述各展示区域中,展示所述各展示区域对应的待展示住房公积金数据,其中,所述待展示住房公积金数据包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

可选地,所述基于ECharts,生成住房公积金数据对应的展示网页,包括:采用超文本标记语言和层叠样式表,生成住房公积金数据对应的展示网页;引入ECharts插件,生成所述第三展示区域对应的地图,以利用生成的地图展示实时转移数据。

可选地,所述设置各展示区域的数据展示形式,包括:设置所述第二展示区域的数据展示形式为轮播播放;设置所述第三展示区域的数据展示形式为动态效果展示。

可选地,所述按照所述各展示区域的数据展示形式,在所述各展示区域中,展示所述各展示区域对应的待展示住房公积金数据,包括:在所述第一展示区域,显示所述待展示交易量数据;在所述第二展示区域,对所述待展示转移活跃度数据进行轮播播放;在所述第三展示区域对应的地图上,对所述待展示实时转移数据进行动态效果展示。

可选地,所述在所述第三展示区域对应的地图上,对所述待展示实时转移数据进行动态效果展示,包括:确定所述待展示实时转移数据对应的转入地和转出地;在所述第三展示区域对应的地图上,通过有向线条连接所述转入地和所述转出地,生成由所述转出地指向所述转入地的转移轨迹,以通过所述转移轨迹展示所述待展示实时转移数据的流动趋势。

可选地,在生成由所述转出地指向所述转入地的转移轨迹之后,所述方法还包括:当监控到鼠标移动到所述转移轨迹之后,显示所述待展示实时转移数据对应的转移信息,其中,所述转移信息包括:转移用户、转入地、转出地、转移时间和转移金额。

可选地,所述方法还包括:设置所述转移轨迹的线条样式、箭头形状和显示效果。

可选地,所述对所述待展示转移活跃度数据进行轮播播放,包括:按照预设的轮播周期,将所述待展示转移活跃度数据对应的轮播列表进行轮播播放。

可选地,在按照所述各展示区域的数据展示形式,在所述各展示区域中,展示所述各展示区域对应的待展示住房公积金数据之前,所述方法还包括:利用预先配置的接口,按照预设的时间周期,获取所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据。

可选地,在获取所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据之后,所述方法还包括:对所述待展示转移活跃度数据进行处理,生成所述待展示转移活跃度数据对应的轮播列表。

可选地,所述方法还包括:设置全局变量,利用设置的全局变量存储所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据。

可选地,所述利用预先配置的接口,按照预设的时间周期,获取所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据,包括:利用预先配置的第一接口,按照预设的第一时间周期,获取所述待展示交易量数据;利用预先配置的第二接口,按照预设的第二时间周期,获取所述待展示转移活跃度数据;利用预先配置的第三接口,按照预设的第三时间周期,获取所述待展示实时转移数据。

为实现上述目的,根据本发明实施例的再一个方面,提供了一种基于ECharts的住房公积金数据展示装置。

本发明实施例的基于ECharts的住房公积金数据展示装置,包括:生成模块,用于基于ECharts,生成住房公积金数据对应的展示网页,其中,所述展示网页包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域;设置模块,用于设置各展示区域的数据展示形式,其中,所述数据展示形式包括:轮播播放、动态效果展示;展示模块,用于按照所述各展示区域的数据展示形式,在所述各展示区域中,展示所述各展示区域对应的待展示住房公积金数据,其中,所述待展示住房公积金数据包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

可选地,所述生成模块还用于:采用超文本标记语言和层叠样式表,生成住房公积金数据对应的展示网页;引入ECharts插件,生成所述第三展示区域对应的地图,以利用生成的地图展示实时转移数据。

可选地,所述设置模块还用于:设置所述第二展示区域的数据展示形式为轮播播放;设置所述第三展示区域的数据展示形式为动态效果展示。

可选地,所述展示模块还用于:在所述第一展示区域,显示所述待展示交易量数据;在所述第二展示区域,对所述待展示转移活跃度数据进行轮播播放;在所述第三展示区域对应的地图上,对所述待展示实时转移数据进行动态效果展示。

可选地,所述展示模块还用于:确定所述待展示实时转移数据对应的转入地和转出地;在所述第三展示区域对应的地图上,通过有向线条连接所述转入地和所述转出地,生成由所述转出地指向所述转入地的转移轨迹,以通过所述转移轨迹展示所述待展示实时转移数据的流动趋势。

可选地,所述展示模块还用于:当监控到鼠标移动到所述转移轨迹之后,显示所述待展示实时转移数据对应的转移信息,其中,所述转移信息包括:转移用户、转入地、转出地、转移时间和转移金额。

可选地,所述展示模块还用于:设置所述转移轨迹的线条样式、箭头形状和显示效果。

可选地,所述展示模块还用于:按照预设的轮播周期,将所述待展示转移活跃度数据对应的轮播列表进行轮播播放。

可选地,所述装置还包括获取模块,用于:利用预先配置的接口,按照预设的时间周期,获取所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据。

可选地,所述获取模块还用于:对所述待展示转移活跃度数据进行处理,生成所述待展示转移活跃度数据对应的轮播列表。

可选地,所述获取模块还用于:设置全局变量,利用设置的全局变量存储所述待展示交易量数据、所述待展示转移活跃度数据和所述待展示实时转移数据。

可选地,所述获取模块还用于:利用预先配置的第一接口,按照预设的第一时间周期,获取所述待展示交易量数据;利用预先配置的第二接口,按照预设的第二时间周期,获取所述待展示转移活跃度数据;利用预先配置的第三接口,按照预设的第三时间周期,获取所述待展示实时转移数据。

为实现上述目的,根据本发明实施例的又一个方面,提供了一种电子设备。

本发明实施例的一种电子设备包括:一个或多个处理器;存储装置,用于存储一个或多个程序,当一个或多个程序被一个或多个处理器执行,使得一个或多个处理器实现本发明实施例的基于ECharts的住房公积金数据展示方法。

为实现上述目的,根据本发明实施例的还一个方面,提供了一种计算机可读介质。

本发明实施例的一种计算机可读介质,其上存储有计算机程序,程序被处理器执行时实现本发明实施例的基于ECharts的住房公积金数据展示方法。

上述发明中的一个实施例具有如下优点或有益效果:能够利用ECharts生成住房公积金转移业务对应的数据展示网页,即住房公积金数据对应的展示网页,并且设置不同展示区域对应的数据展示形式,进而按照设置的数据展示形式,将不同数据在不同展示区域进行展示,解决了当前展示形式比较单一的问题,便于观察,给用户带来较好的视觉效果;并且动态效果展示的数据展示形式,能够展示数据的实时转移情况,达到了较好的数据展示效果。

上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。

附图说明

附图用于更好地理解本发明,不构成对本发明的不当限定。其中:

图1是根据本发明实施例的基于ECharts的住房公积金数据展示方法的主要步骤的示意图;

图2是根据本发明实施例的基于ECharts的住房公积金数据展示方法的主要过程的示意图;

图3是根据本发明实施例的基于ECharts的住房公积金数据展示装置的主要模块的示意图;

图4是本发明实施例可以应用于其中的示例性系统架构图;

图5是适于用来实现本发明实施例的终端设备或服务器的计算机系统的结构示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明,其中包括本发明实施例的各种细节以助于理解,应当将它们认为仅仅是示范性的。因此,本领域普通技术人员应当认识到,可以对这里描述的实施例做出各种改变和修改,而不会背离本发明的范围和精神。同样,为了清楚和简明,以下的描述中省略了对公知功能和结构的描述。

为了便于理解,以下提供本发明实施例涉及的词语的名词解释:

ECharts:一个使用JavaScript实现的开源可视化库,涵盖各行业图表,特色是地图,还提供了柱状图、折线图、饼图、气泡图及四象限图等,能够满足各种需求。并且,ECharts使用简单,经过封装后支持参数化调用,只要根据业务需要设置相应的参数,就能得到完美的图形展示效果。

JavaScript:简称为JS,一种具有函数优先的轻量级、解释型或即时编译型的高级编程语言。其可以在浏览器环境中运行,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。

超文本标记语言:即HTML,全称为Hyper Text Marked Language,是标准通用化标记语言SGML的应用。用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如UNIX、Windows等)。使用HTML语言,将所需要表达的信息按某种规则写成HTML文件,通过专用的浏览器来识别,并将这些HTML文件“翻译”成可以识别的信息,即现在所见到的网页。

层叠样式表:即Css,全称为Cascading Style Sheets,是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。

图1是根据本发明实施例的基于ECharts的住房公积金数据展示方法的主要步骤的示意图。如图1所示,基于ECharts的住房公积金数据展示方法的主要步骤可以包括步骤S101至步骤S103。

步骤S101:基于ECharts,生成住房公积金数据对应的展示网页。其中,住房公积金数据可以包括:交易量数据、转移活跃度数据和实时转移数据。

交易量数据可以包括:全国累计交易笔数、全国累计交易金额、今日累计交易笔数、今日累计交易金额等。需要注意的是,此处的交易可以特指为公积金转移业务发生的交易,也可以为公积金其他业务或所有业务产生的交易,对此不作限定。

转移活跃度数据可以为近一年的转移活跃度数据,当然也可以是近半年的转移活跃度数据,具体时间范围可以根据实际需求设置。另外,转移活跃度数据可以按照省份统计,也可以按照公积金管理中心统计。比如,对近一年的各省份公积金转移数据,按照从大到小进行排序,得到省份活跃度排名数据。此外,转移活跃度数据可以包括:转入数据和转出数据。比如,对近一年的各公积金管理中心的转入数据,按照从大到小进行排序,得到各公积金管理中心的转入数据排名。

实时转移数据为当前正在发生的异地转移业务产生的数据。实时转移数据包含的转移信息可以为:转移用户、转入地、转出地、转移时间和转移金额。比如,由于工作调动,用户A需要将住房公积金由S1省转移到S2省,那么用户A为转移用户,S1省为转出地,S2省为转入地。

本发明实施例中,生成的展示网页可以包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域。考虑到对于不同的公积金数据,其所需要的展示效果是不同的,如转移活跃度数据需要体现出数据排名,再如实时转移数据需要体现出动态变化趋势。因此,在展示网页中,通过不同的展示区域对数据进行展示。

进一步地,基于ECharts,生成住房公积金数据对应的展示网页,可以包括:采用超文本标记语言和层叠样式表,生成住房公积金数据对应的展示网页;引入ECharts插件,生成第三展示区域对应的地图,以利用生成的地图展示实时转移数据。

具体地,采用HTML5+Css3开发住房公积金数据的展示网页,先把页面上的主要元素以及各展示区域开发出来,形成静态页面框架。然后,引入ECharts插件,利用ECharts生成第三展示区域对应的地图,即在第三展示区域中,生成全国区域地图。

ECharts实例的setOption方法可对图形进行配置,参数为一个Object。ECharts会根据不同的参数绘制出各种类型的图形。考虑到第三展示区域展示的为实时转移数据,需要体现出数据的动态流动趋势,采用地图能够直观展示出数据从转出地到转入地的流动趋势。因此,可以利用ECharts在第三展示区域绘制出地图,从而可以利用地图展示实时转移数据。

步骤S102:设置各展示区域的数据展示形式。

在获取到展示页面后,可以为展示页面中的各展示区域设置数据展示形式,以便后续可以按照设置的数据展示形式对数据进行展示。

其中,数据展示形式包括:轮播播放、动态效果展示。轮播播放是指按照设置的播放顺序,轮流展示每页数据。动态效果展示可以理解为将数据的动态流动趋势展示出来。

进一步地,设置各展示区域的数据展示形式,包括:设置第二展示区域的数据展示形式为轮播播放;设置第三展示区域的数据展示形式为动态效果展示。考虑到第二展示区域需要展示转移活跃度数据,也即需要展示转移活跃度排名,因此可以采用轮播播放的数据展示形式。以及,第三展示区域需要展示实时转移数据,因此需要体现出数据的动态流动趋势,所以可以采用动态效果展示的数据展示形式。

步骤S103:按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据。其中,待展示住房公积金数据包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

通过步骤S101生成住房公积金数据对应的展示网页,即获得不同住房公积金数据对应的展示区域。通过步骤S102设置各展示区域的数据展示形式,即根据不同住房公积金数据对应的展示需求,设置各展示区域的数据展示形式。然后在步骤S103中,按照设置的数据展示形式,对待展示数据进行展示。

具体地,按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据,可以包括:在第一展示区域,显示待展示交易量数据;在第二展示区域,对待展示转移活跃度数据进行轮播播放;在第三展示区域对应的地图上,对待展示实时转移数据进行动态效果展示。也就是说,对于待展示交易量数据,可以在第一展示区域直接展示;对于待展示转移活跃度数据,可以在第二展示区域对其进行轮播播放;对于待展示实时转移数据,可以在第三展示区域的地图上,展示出该数据的动态流动趋势。

当前,与转移业务相关的数据的展示形式比较单一,而且不能实时展示数据的转移情况,难以达到较佳的数据展示效果。但是,本发明实施例提供的基于ECharts的住房公积金数据展示方法,能够利用ECharts生成住房公积金转移业务对应的数据展示网页,即住房公积金数据对应的展示网页,并且设置不同展示区域对应的数据展示形式,进而按照设置的数据展示形式,将不同数据在不同展示区域进行展示,解决了当前展示形式比较单一的问题,便于观察,给用户带来较好的视觉效果;并且动态效果展示的数据展示形式,能够展示数据的实时转移情况,达到了较好的数据展示效果。

作为本发明的实施例,在按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据之前,基于ECharts的住房公积金数据展示方法还可以包括:利用预先配置的接口,按照预设的时间周期,获取待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

在对数据进行展示之前,可以通过接口获取到需要展示的数据,即待展示住房公积金数据。具体地,可以利用axios调用后端服务的接口获取对应的数据。其中,axios是一个基于异步编程的HTTP库,可以用在浏览器中,是常用的请求后端接口的JS库。

由于不同住房公积金数据,其所需要的数据展示形式是不同的。因此,可以预先配置多个接口,规定每个接口对应的住房公积金数据。此外,不同住房公积金数据,其刷新频率是不同的,或者其所需要的展示周期是不同的。也就是说,展示页面中各展示区域的数据每间隔一段时间就会刷新一次,从而可以实现住房公积金数据的实时展现效果。并且,不同展示区域的数据刷新时间周期是不同的,如交易量数据需要每3分钟刷新一次,转移活跃度数据需要每10分钟刷新一次,实时转移数据需要每5分钟刷新一次。所以,不同接口获取数据的时间周期也是不同的。具体地,可以通过steInterval()来每隔一段时间请求一次后端服务接口,然后重新渲染展示获取到的数据。

所以,作为本发明的实施例,利用预先配置的接口,按照预设的时间周期,获取待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据,可以包括:利用预先配置的第一接口,按照预设的第一时间周期,获取待展示交易量数据;利用预先配置的第二接口,按照预设的第二时间周期,获取待展示转移活跃度数据;利用预先配置的第三接口,按照预设的第三时间周期,获取待展示实时转移数据。其中,第一、第二以及第三是为了区分不同的接口,或者区分不同的时间周期。

此外,还可以设置全局变量,利用设置的全局变量存储待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据,以便于在不同展示区域进行数据展示。具体地,可以设置3个全局变量,分别用于存储从第一接口获取的待展示交易量数据、从第二接口获取的待展示转移活跃度数据和从第三接口获取的待展示实时转移数据,以便于在展示区域进行展示。

综上,可以利用axios调用后端服务的接口获取对应的数据。按照和后端约定的接口、入参传递规则以及返回数据的格式,请求后端服务接口,在回调函数中,将返回的数据存入设置的全局变量中。

另外,在获取待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据之后,还可以对待展示转移活跃度数据进行处理,生成待展示转移活跃度数据对应的轮播列表。

采用轮播播放的形式展示数据,需要设置每页列表可以展示的数据数量,如每页展示10个数据。因此,在获取到待展示转移活跃度数据之后,可以调用JS自带生成列表方法,生成该待展示转移活跃度数据对应的轮播列表。需要注意的是,若获取到的待展示转移活跃度数据没有按照顺序进行排序,那么还需要调用JS对其进行排序,然后生成活跃度对应的轮播列表。一般情况下,按照活跃度从大到小进行排序。

作为本发明的实施例,在第三展示区域对应的地图上,对待展示实时转移数据进行动态效果展示,可以包括:确定待展示实时转移数据对应的转入地和转出地;在第三展示区域对应的地图上,通过有向线条连接转入地和转出地,生成由转出地指向转入地的转移轨迹,以通过转移轨迹展示待展示实时转移数据的流动趋势。

在第三展示区域,对于正在发生的住房公积金转移业务,在地图上会对转出地和转入地进行动效展示,如通过有向线条连接转出地和转入地。比如,用户A将住房公积金由S1省转移到S2省,则可以在地图上连接S1和S2,并且线条方向是S1指向S2。

进一步地,在生成由转出地指向转入地的转移轨迹之后,当监控到鼠标移动到转移轨迹之后,显示待展示实时转移数据对应的转移信息,其中,转移信息包括:转移用户、转入地、转出地、转移时间和转移金额。

对于正在发生的异地转移业务,在地图上会对发生转出地和转入地进行展示,即一笔交易发生的转出地和转入地之间,可以通过有向线条连接。当鼠标移动到该有向线条时,会出现具体的转移信息提示,如显示出转移用户、转入地、转出地、转移时间和转移金额等信息,从而可以给用户更好的数据展示效果。此外,还可以设置转移轨迹的线条样式、箭头形状和显示效果。其中,具体实现可以为:将转入地和转出地push到Echarts的serieData配置项中,设置线条特效、转入地及转出地的样式效果,调用ECharts地图实例的setOption方法,即可在地图上生成带有特效效果的移动轨迹。

作为本发明的实施例,对待展示转移活跃度数据进行轮播播放,可以包括:按照预设的轮播周期,将待展示转移活跃度数据对应的轮播列表进行轮播播放。

其中,预设的轮播周期是指对轮播列表进行翻页的周期,如每隔5秒钟翻到下一页。并且,在翻到最后一页之后,在从第一页开始展示。具体可以采用steInterval()实现轮播播放。设置轮播周期反复执行运动函数,将确定的轮播列表轮播显示,播放到最后一页后又切回到首页进行展示。

图2是根据本发明实施例的基于ECharts的住房公积金数据展示方法的主要过程的示意图。如图2所示,基于ECharts的住房公积金数据展示方法的主要过程可以包括:

步骤S201,采用超文本标记语言和层叠样式表,生成住房公积金数据对应的展示网页,其中,展示网页包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域;

步骤S202,引入ECharts插件,生成第三展示区域对应的地图,以利用生成的地图展示实时转移数据;

步骤S203,设置第二展示区域的数据展示形式为轮播播放,以及设置第三展示区域的数据展示形式为动态效果展示;

步骤S204,获取待展示住房公积金数据,其中,待展示住房公积金数据包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据;

步骤S205,在第一展示区域,显示待展示交易量数据;

步骤S206,在第二展示区域,按照预设的轮播周期,将待展示转移活跃度数据对应的轮播列表进行轮播播放;

步骤S207,确定待展示实时转移数据对应的转入地和转出地;

步骤S208,在第三展示区域对应的地图上,通过有向线条连接转入地和转出地,生成由转出地指向转入地的转移轨迹,以通过转移轨迹展示待展示实时转移数据的流动趋势;

步骤S209,当监控到鼠标移动到转移轨迹之后,显示待展示实时转移数据对应的转移信息,其中,转移信息包括:转移用户、转入地、转出地、转移时间和转移金额。

其中,已经在上文详细说明步骤S204中获取待展示住房公积金数据的主要过程,此处不再进行详细说明。还有,通过步骤S205至步骤S209得到,对于不同的待展示数据,其对应的展示方法是不同的。以及,在步骤S208的生成由转出地指向转入地的转移轨迹之前,可以根据实际需要设置转移轨迹的线条样式、箭头形状和显示效果;也可以在生成由转出地指向转入地的转移轨迹之后,根据实际需求调整转移轨迹的线条样式、箭头形状和显示效果。

根据本发明实施例提供的基于ECharts的住房公积金数据展示方法,能够利用ECharts生成住房公积金转移业务对应的数据展示网页,即住房公积金数据对应的展示网页,并且设置不同展示区域对应的数据展示形式,进而按照设置的数据展示形式,将不同数据在不同展示区域进行展示,解决了当前展示形式比较单一的问题,便于观察,给用户带来较好的视觉效果;并且动态效果展示的数据展示形式,能够展示数据的实时转移情况,达到了较好的数据展示效果。

图3是根据本发明实施例的基于ECharts的住房公积金数据展示装置的主要模块的示意图。如图3所示,基于ECharts的住房公积金数据展示装置300的主要模块可以包括:生成模块301、设置模块302和展示模块303。

生成模块301可用于:基于ECharts,生成住房公积金数据对应的展示网页。其中,展示网页可以包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域。设置模块302可用于:设置各展示区域的数据展示形式。其中,数据展示形式可以包括:轮播播放、动态效果展示。展示模块303可用于:按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据。其中,待展示住房公积金数据可以包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

作为本发明的实施例,生成模块301还可用于:采用超文本标记语言和层叠样式表,生成住房公积金数据对应的展示网页;引入ECharts插件,生成第三展示区域对应的地图,以利用生成的地图展示实时转移数据。

作为本发明的实施例,设置模块302还可用于:设置第二展示区域的数据展示形式为轮播播放;设置第三展示区域的数据展示形式为动态效果展示。

作为本发明的实施例,展示模块303还可用于:在第一展示区域,显示待展示交易量数据;在第二展示区域,对待展示转移活跃度数据进行轮播播放;在第三展示区域对应的地图上,对待展示实时转移数据进行动态效果展示。

作为本发明的实施例,展示模块303还可用于:确定待展示实时转移数据对应的转入地和转出地;在第三展示区域对应的地图上,通过有向线条连接转入地和转出地,生成由转出地指向转入地的转移轨迹,以通过转移轨迹展示待展示实时转移数据的流动趋势。

作为本发明的实施例,展示模块303还可用于:当监控到鼠标移动到转移轨迹之后,显示待展示实时转移数据对应的转移信息,其中,转移信息包括:转移用户、转入地、转出地、转移时间和转移金额。

作为本发明的实施例,展示模块303还可用于:设置转移轨迹的线条样式、箭头形状和显示效果。

作为本发明的实施例,展示模块303还可用于:按照预设的轮播周期,将待展示转移活跃度数据对应的轮播列表进行轮播播放。

如图3所示,基于ECharts的住房公积金数据展示装置300还可以包括获取模块304。该获取模块304可用于:利用预先配置的接口,按照预设的时间周期,获取待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

作为本发明的实施例,获取模块304还可用于:对待展示转移活跃度数据进行处理,生成待展示转移活跃度数据对应的轮播列表。

作为本发明的实施例,获取模块304还可用于:设置多个全局变量,利用设置的全局变量存储待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

作为本发明的实施例,获取模块304还可用于:利用预先配置的第一接口,按照预设的第一时间周期,获取待展示交易量数据;利用预先配置的第二接口,按照预设的第二时间周期,获取待展示转移活跃度数据;利用预先配置的第三接口,按照预设的第三时间周期,获取待展示实时转移数据。

根据本发明实施例的基于ECharts的住房公积金数据展示装置,能够利用ECharts生成住房公积金转移业务对应的数据展示网页,即住房公积金数据对应的展示网页,并且设置不同展示区域对应的数据展示形式,进而按照设置的数据展示形式,将不同数据在不同展示区域进行展示,解决了当前展示形式比较单一的问题,便于观察,给用户带来较好的视觉效果;并且动态效果展示的数据展示形式,能够展示数据的实时转移情况,达到了较好的数据展示效果。

图4示出了可以应用本发明实施例的基于ECharts的住房公积金数据展示方法或基于ECharts的住房公积金数据展示装置的示例性系统架构400。

如图4所示,系统架构400可以包括终端设备401、402、403,网络404和服务器405。网络404用以在终端设备401、402、403和服务器405之间提供通信链路的介质。网络404可以包括各种连接类型,例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备401、402、403通过网络404与服务器405交互,以接收或发送消息等。终端设备401、402、403可以是具有显示屏并且支持网页浏览的各种电子设备,包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。

服务器405可以是提供各种服务的服务器,例如作为用户利用终端设备401、402、403进行基于ECharts的住房公积金数据展示的过程中,提供支持的后台管理服务器(仅为示例);再例如,服务器405可以完成本发明实施例的基于ECharts的住房公积金数据展示。

需要说明的是,本发明实施例所提供的基于ECharts的住房公积金数据展示方法一般由服务器405执行,相应地,基于ECharts的住房公积金数据展示装置一般设置于服务器405中。

应该理解,图4中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要,可以具有任意数目的终端设备、网络和服务器。

下面参考图5,其示出了适于用来实现本发明实施例的终端设备的计算机系统500的结构示意图。图5示出的终端设备仅仅是一个示例,不应对本发明实施例的功能和使用范围带来任何限制。

如图5所示,计算机系统500包括中央处理单元(CPU)501,其可以根据存储在只读存储器(ROM)502中的程序或者从存储部分508加载到随机访问存储器(RAM)503中的程序而执行各种适当的动作和处理。在RAM 503中,还存储有系统500操作所需的各种程序和数据。CPU 501、ROM 502以及RAM 503通过总线504彼此相连。输入/输出(I/O)接口505也连接至总线504。

以下部件连接至I/O接口505:包括键盘、鼠标等的输入部分506;包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分507;包括硬盘等的存储部分508;以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分509。通信部分509经由诸如因特网的网络执行通信处理。驱动器510也根据需要连接至I/O接口505。可拆卸介质511,诸如磁盘、光盘、磁光盘、半导体存储器等等,根据需要安装在驱动器510上,以便于从其上读出的计算机程序根据需要被安装入存储部分508。

特别地,根据本发明公开的实施例,上文参考流程图描述的过程可以被实现为计算机软件程序。例如,本发明公开的实施例包括一种计算机程序产品,其包括承载在计算机可读介质上的计算机程序,该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中,该计算机程序可以通过通信部分509从网络上被下载和安装,和/或从可拆卸介质511被安装。在该计算机程序被中央处理单元(CPU)501执行时,执行本发明的系统中限定的上述功能。

需要说明的是,本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本发明中,计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于:无线、电线、光缆、RF等等,或者上述的任意合适的组合。

附图中的流程图和框图,图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上,流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分,上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意,在有些作为替换的实现中,方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如,两个接连地表示的方框实际上可以基本并行地执行,它们有时也可以按相反的顺序执行,这依所涉及的功能而定。也要注意的是,框图或流程图中的每个方框、以及框图或流程图中的方框的组合,可以用执行规定的功能或操作的专用的基于硬件的系统来实现,或者可以用专用硬件与计算机指令的组合来实现。

描述于本发明实施例中所涉及到的模块可以通过软件的方式实现,也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中,例如,可以描述为:一种处理器包括生成模块、设置模块和展示模块。其中,这些模块的名称在某种情况下并不构成对该模块本身的限定,例如,生成模块还可以被描述为“基于ECharts生成住房公积金数据对应的展示网页的模块”。

作为另一方面,本发明还提供了一种计算机可读介质,该计算机可读介质可以是上述实施例中描述的设备中所包含的;也可以是单独存在,而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序,当上述一个或者多个程序被一个该设备执行时,使得该设备包括:基于ECharts,生成住房公积金数据对应的展示网页,其中,展示网页包括:交易量对应的第一展示区域、转移活跃度对应的第二展示区域和实时转移数据对应的第三展示区域;设置各展示区域的数据展示形式,其中,数据展示形式包括:轮播播放、动态效果展示;按照各展示区域的数据展示形式,在各展示区域中,展示各展示区域对应的待展示住房公积金数据,其中,待展示住房公积金数据包括:待展示交易量数据、待展示转移活跃度数据和待展示实时转移数据。

根据本发明实施例的技术方案,能够利用ECharts生成住房公积金转移业务对应的数据展示网页,即住房公积金数据对应的展示网页,并且设置不同展示区域对应的数据展示形式,进而按照设置的数据展示形式,将不同数据在不同展示区域进行展示,解决了当前展示形式比较单一的问题,便于观察,给用户带来较好的视觉效果;并且动态效果展示的数据展示形式,能够展示数据的实时转移情况,达到了较好的数据展示效果。

上述具体实施方式,并不构成对本发明保护范围的限制。本领域技术人员应该明白的是,取决于设计要求和其他因素,可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等,均应包含在本发明保护范围之内。

去获取专利,查看全文>

相似文献

  • 专利
  • 中文文献
  • 外文文献
获取专利

客服邮箱:kefu@zhangqiaokeyan.com

京公网安备:11010802029741号 ICP备案号:京ICP备15016152号-6 六维联合信息科技 (北京) 有限公司©版权所有
  • 客服微信

  • 服务号