CN112347171A

CN112347171A - 一种将接口数据转为可视化图表方法及装置、存储介质

Info

Publication number: CN112347171A
Application number: CN202011212047.6A
Authority: CN
Inventors: 邓嘉俊; 彭和平; 柒强
Original assignee: Guangzhou Lango Electronic Science and Technology Co Ltd
Current assignee: Guangzhou Lango Electronic Science and Technology Co Ltd
Priority date: 2020-11-03
Filing date: 2020-11-03
Publication date: 2021-02-09

Abstract

本发明公开了一种将接口数据转为可视化图表方法及装置、存储介质，本发明方法包括：获取接口数据并读取接口数据；根据客户需求确定图表的属性、处理函数对应关系和图表数据结构；将所述接口数据转为具有所述图表数据结构的数据；采用html5 Canvas绘图技术，通过图表插件工具将具有所述图表数据结构的数据，绘画成图像。本发明通过将接口数据根据客户选择的图表属性、处理函数对应关系，得到对应所选图表的数据结构，并自动调用图表插件工具，利用html5 Canvas技术，将接口数据转成可视化图表的图像。

Description

一种将接口数据转为可视化图表方法及装置、存储介质

技术领域

本发明涉及互联网技术领域，具体涉及一种将接口数据转为可视化图表方法及装置、存储介质。

背景技术

现在正处于大数据的时代，有数据的地方，就会少不了数据的可视化，存储和表示数据，易于人们阅读和编写，同时也易于机器解析和生成，是数据传输的目标。

现有技术在网络传输数据，将接口数据转变为可视化图表时，每次都需要程序员进行编写代码，才能实现将接口数据转变为可视化图表。这样，人们在得到传输数据时，无法方便且快速的获取可视化数据。

发明内容

鉴于以上技术问题，本发明的目的在于提供将接口数据转为可视化图表方法及装置、存储介质，解决现有技术在数据传输中人们无法方便且快速的获取可视化数据的问题。

本发明采用以下技术方案：

本发明的一种将接口数据转为可视化图表方法，包括：

获取接口数据并读取接口数据；

根据客户需求确定图表的属性、处理函数对应关系和图表数据结构；

将所述接口数据转为具有所述图表数据结构的数据；

采用html5 Canvas绘图技术，通过图表插件工具将具有所述图表数据结构的数据，绘画成图像。

进一步的，将所述接口数据转为具有所述图表数据结构的数据的步骤包括：将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

进一步的，所述预设配置规则的设定方法包括：将所述接口数据的key键值属性对应到图表的key键值属性，将所述接口数据的value值对应到图表的value值。

进一步的，所述图表数据结构包括：文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。

进一步的，当所述图表数据结构为柱状图表数据结构时，所述接口数据的value值经过函数处理后作为柱的值。

进一步的，所述获取接口数据的步骤包括：直接请求第三方接口获取接口数据，或通过后台接口对接服务间接请求接口数据。

进一步的，所述图表插件工具采用JavaScript脚本。

本发明的一种将接口数据转为可视化图表装置，包括：

数据获取模块，用于获取接口数据并读取接口数据；

图表选择模块，用于客户根据需求确定图表的属性、处理函数对应关系和图表数据结构；

图表转换模块，用于将所述接口数据转为具有所述图表数据结构的数据；

图表绘制模块，用于采用html5 Canvas绘图技术，通过图表插件工具将具有所述图表数据结构的数据，绘画成图像。

进一步的，所述图表转换模块，用于将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

一种计算机存储介质，其上存储有计算机程序，所述计算机程序在被处理器执行时，实现所述的将接口数据转为可视化图表方法。

相比现有技术，本发明的有益效果在于：

本发明通过将接口数据根据客户选择的图表属性、处理函数对应关系，得到对应所选图表的数据结构，并自动调用图表插件工具，利用html5 Canvas技术，将接口数据转成可视化图表的图像。

附图说明

图1为本发明将接口数据转为可视化图表方法的流程示意图；

图2为本发明将接口数据转为可视化图表方法具体实施例中的示意图；

图3为本发明将接口数据转为可视化图表装置的示意图。

具体实施方式

下面，结合附图以及具体实施方式，对本发明做进一步描述，需要说明的是，在不相冲突的前提下，以下描述的各实施例之间或各技术特征之间可以任意组合形成新的实施例：

实施例一：

一种将接口数据转为可视化图表方法，如图1所示，包括：

步骤S1:获取接口数据并读取接口数据；

具体的，所述获取接口数据的步骤包括：直接请求第三方接口获取接口数据，或通过后台接口对接服务间接请求接口数据。

步骤S2:根据客户需求确定图表的属性、处理函数对应关系和图表数据结构；

在本申请中，所述图表数据结构可包括：文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。

应理解的是，图表的选择是根据客户需求设定的，图表数据结是根据用户选择的图表决定的，文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表分别对应文本图表的数据结构、环形图表的数据结构、折线图表的数据结构、柱状图表的数据结构、条状图表的数据结构、表格图表的数据结构、累计图表的数据结构、地图图表的数据结构及气泡图表的数据结构。

例如，当客户选择图表为柱状图表时，那么对应的数据结构就是柱状图表的数据结构。具体如下：

myChart.setOption({

title:{

text:'异步数据加载示例'

},

tooltip:{},

legend:{

data:['销量']

},

xAxis:{

data:["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]

},

yAxis:{},

series:[{

name:'销量',

type:'bar',

data:[5,20,36,10,10,20]

}]

当所述图表数据结构为柱状图表数据结构时，所述接口数据的value值可是经过函数处理后作为柱的值，可直接作为为柱的值。通过标记用户选择的图表的属性、处理函数对应关系、对应所选图表的数据结构，从而可得到所述图表数据结构的数据结构。

步骤S3:将所述接口数据转为具有所述图表数据结构的数据；

将所述接口数据转为具有所述图表数据结构的数据的步骤包括：将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

具体的，所述预设配置规则的设定方法包括：将所述接口数据的key键值属性对应到图表的key键值属性，将所述接口数据的value值对应到图表的value值。

步骤S4:采用html5 Canvas绘图技术，通过图表插件工具将具有所述图表数据结构的数据，绘画成图像。

具体的，所述图表插件工具采用JavaScript脚本。本发明的图表插件工具不限定于采用JavaScript脚本，采用JavaScript脚本只是本发明在具体应用中的一例子。

在本发明的具体实施例中，当客户选择图表属性为柱状图表时，将接口数据转换为柱状图表的数据结构后，然后调用图表插件工具，利用html5 Canvas技术，就可将图表数据结构转为客户需要的柱状图可视化展示出来，如图2所示，接口数据的信息可包含"衬衫为5件","羊毛衫为20件","雪纺衫为35件","裤子为10条","高跟鞋为10双","袜子20条"，接口数据的key键值可为包含"衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"等信息的“销售种类”，柱状图表的key键值即每个柱的标签对应为"衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"，每个柱的value值就对应"衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"的销量数据。

实施例二：

本发明的一种将接口数据转为可视化图表装置，如图3所示，包括：

数据获取模块，用于获取接口数据并读取接口数据；

具体的，数据获取模块，用于直接请求第三方接口获取接口数据，或通过后台接口对接服务间接请求接口数据。

具体的，所述图表转换模块，用于将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

所述预设配置规则的设定方法包括：将所述接口数据的key键值属性对应到图表的key键值属性，将所述接口数据的value值对应到图表的value值。

本发明将接口数据转为可视化图表装置可通过将数据获取模块、图表选择模块和图表转换模块整合成软件模块。当用户启动软件后，通过图表绘制模块进行绘图，就可实现获取接口数据并将接口数据，并套入客户选择的图表属性、处理函数对应关系，得到对应所选图表的数据结构，自动调用图表插件工具，利用html5 Canvas技术，将接口数据转成可视化图表的图像。

本发明还提供一种计算机存储介质，其上存储有计算机程序，本发明的方法如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在该计算机存储介质中。基于这样的理解，本发明实现上述实施例方法中的全部或部分流程，也可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一计算机存储介质中，该计算机程序在被处理器执行时，可实现上述各个方法实施例的步骤。其中，所述计算机程序包括计算机程序代码，所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机存储介质可以包括：能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，Random Access Memory)、电载波信号、电信信号以及软件分发介质等。需要说明的是，所述计算机存储介质包含的内容可以根据司法管辖区内立法和专利实践的要求进行适当的增减，例如在某些司法管辖区，根据立法和专利实践，计算机存储介质不包括电载波信号和电信信号。

对本领域的技术人员来说，可根据以上描述的技术方案以及构思，做出其它各种相应的改变以及形变，而所有的这些改变以及形变都应该属于本发明权利要求的保护范围之内。

Claims

1.一种将接口数据转为可视化图表方法，其特征在于，包括：

获取接口数据并读取接口数据；

根据客户需求确定图表的属性、处理函数对应关系和图表数据结构，将所述接口数据转为具有所述图表数据结构的数据；

2.根据权利要求1所述的将接口数据转为可视化图表方法，其特征在于，将所述接口数据转为具有所述图表数据结构的数据的步骤包括：将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

3.根据权利要求2所述的将接口数据转为可视化图表方法，其特征在于,所述预设配置规则的设定方法包括：将所述接口数据的key键值属性对应到图表的key键值属性，将所述接口数据的value值对应到图表的value值。

4.根据权利要求3所述的将接口数据转为可视化图表方法，其特征在于,所述图表数据结构包括：文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。

5.根据权利要求4所述的将接口数据转为可视化图表方法，其特征在于,当所述图表数据结构为柱状图表数据结构时，所述接口数据的value值经过函数处理后作为柱的值。

6.根据权利要求4所述的将接口数据转为可视化图表方法，其特征在于,所述获取接口数据的步骤包括：直接请求第三方接口获取接口数据，或通过后台接口对接服务间接请求接口数据。

7.根据权利要求4所述的将接口数据转为可视化图表方法，其特征在于,所述图表插件工具采用JavaScript脚本。

8.一种将接口数据转为可视化图表装置，其特征在于,包括：

数据获取模块，用于获取接口数据并读取接口数据；

9.根据权利要求8所述的将接口数据转为可视化图表装置，其特征在于,所述图表转换模块，用于将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。

10.一种计算机存储介质，其上存储有计算机程序，其特征在于，所述计算机程序在被处理器执行时，实现如权利要求1-7任一项所述的将接口数据转为可视化图表方法。