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

技术编号:27314426 阅读:28 留言:0更新日期:2021-02-10 09:43
本发明专利技术公开了一种将接口数据转为可视化图表方法及装置、存储介质,本发明专利技术方法包括:获取接口数据并读取接口数据;根据客户需求确定图表的属性、处理函数对应关系和图表数据结构;将所述接口数据转为具有所述图表数据结构的数据;采用html5 Canvas绘图技术,通过图表插件工具将具有所述图表数据结构的数据,绘画成图像。本发明专利技术通过将接口数据根据客户选择的图表属性、处理函数对应关系,得到对应所选图表的数据结构,并自动调用图表插件工具,利用html5 Canvas技术,将接口数据转成可视化图表的图像。的图像。的图像。

【技术实现步骤摘要】
一种将接口数据转为可视化图表方法及装置、存储介质


[0001]本专利技术涉及互联网
,具体涉及一种将接口数据转为可视化图表方法及装置、存储介质。

技术介绍

[0002]现在正处于大数据的时代,有数据的地方,就会少不了数据的可视化,存储和表示数据,易于人们阅读和编写,同时也易于机器解析和生成,是数据传输的目标。
[0003]现有技术在网络传输数据,将接口数据转变为可视化图表时,每次都需要程序员进行编写代码,才能实现将接口数据转变为可视化图表。这样,人们在得到传输数据时,无法方便且快速的获取可视化数据。

技术实现思路

[0004]鉴于以上技术问题,本专利技术的目的在于提供将接口数据转为可视化图表方法及装置、存储介质,解决现有技术在数据传输中人们无法方便且快速的获取可视化数据的问题。
[0005]本专利技术采用以下技术方案:
[0006]本专利技术的一种将接口数据转为可视化图表方法,包括:
[0007]获取接口数据并读取接口数据;
[0008]根据客户需求确定图表的属性、处理函数对应关系和图表数据结构;
[0009]将所述接口数据转为具有所述图表数据结构的数据;
[0010]采用html5 Canvas绘图技术,通过图表插件工具将具有所述图表数据结构的数据,绘画成图像。
[0011]进一步的,将所述接口数据转为具有所述图表数据结构的数据的步骤包括:将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。
[0012]进一步的,所述预设配置规则的设定方法包括:将所述接口数据的key键值属性对应到图表的key键值属性,将所述接口数据的value值对应到图表的value值。
[0013]进一步的,所述图表数据结构包括:文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。
[0014]进一步的,当所述图表数据结构为柱状图表数据结构时,所述接口数据的value值经过函数处理后作为柱的值。
[0015]进一步的,所述获取接口数据的步骤包括:直接请求第三方接口获取接口数据,或通过后台接口对接服务间接请求接口数据。
[0016]进一步的,所述图表插件工具采用JavaScript脚本。
[0017]本专利技术的一种将接口数据转为可视化图表装置,包括:
[0018]数据获取模块,用于获取接口数据并读取接口数据;
[0019]图表选择模块,用于客户根据需求确定图表的属性、处理函数对应关系和图表数据结构;
[0020]图表转换模块,用于将所述接口数据转为具有所述图表数据结构的数据;
[0021]图表绘制模块,用于采用html5 Canvas绘图技术,通过图表插件工具将具有所述图表数据结构的数据,绘画成图像。
[0022]进一步的,所述图表转换模块,用于将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。
[0023]一种计算机存储介质,其上存储有计算机程序,所述计算机程序在被处理器执行时,实现所述的将接口数据转为可视化图表方法。
[0024]相比现有技术,本专利技术的有益效果在于:
[0025]本专利技术通过将接口数据根据客户选择的图表属性、处理函数对应关系,得到对应所选图表的数据结构,并自动调用图表插件工具,利用html5 Canvas技术,将接口数据转成可视化图表的图像。
附图说明
[0026]图1为本专利技术将接口数据转为可视化图表方法的流程示意图;
[0027]图2为本专利技术将接口数据转为可视化图表方法具体实施例中的示意图;
[0028]图3为本专利技术将接口数据转为可视化图表装置的示意图。
具体实施方式
[0029]下面,结合附图以及具体实施方式,对本专利技术做进一步描述,需要说明的是,在不相冲突的前提下,以下描述的各实施例之间或各技术特征之间可以任意组合形成新的实施例:
[0030]实施例一:
[0031]一种将接口数据转为可视化图表方法,如图1所示,包括:
[0032]步骤S1:获取接口数据并读取接口数据;
[0033]具体的,所述获取接口数据的步骤包括:直接请求第三方接口获取接口数据,或通过后台接口对接服务间接请求接口数据。
[0034]步骤S2:根据客户需求确定图表的属性、处理函数对应关系和图表数据结构;
[0035]在本申请中,所述图表数据结构可包括:文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。
[0036]应理解的是,图表的选择是根据客户需求设定的,图表数据结是根据用户选择的图表决定的,文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表分别对应文本图表的数据结构、环形图表的数据结构、折线图表的数据结构、柱状图表的数据结构、条状图表的数据结构、表格图表的数据结构、累计图表的数据结构、地图图表的数据结构及气泡图表的数据结构。
[0037]例如,当客户选择图表为柱状图表时,那么对应的数据结构就是柱状图表的数据结构。具体如下:
[0038]myChart.setOption({
[0039]title:{
[0040]text:'异步数据加载示例'
[0041]},
[0042]tooltip:{},
[0043]legend:{
[0044]data:['销量'][0045]},
[0046]xAxis:{
[0047]data:["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"][0048]},
[0049]yAxis:{},
[0050]series:[{
[0051]name:'销量',
[0052]type:'bar',
[0053]data:[5,20,36,10,10,20][0054]ꢀꢀꢀꢀ
}][0055]当所述图表数据结构为柱状图表数据结构时,所述接口数据的value值可是经过函数处理后作为柱的值,可直接作为为柱的值。通过标记用户选择的图表的属性、处理函数对应关系、对应所选图表的数据结构,从而可得到所述图表数据结构的数据结构。
[0056]步骤S3:将所述接口数据转为具有所述图表数据结构的数据;
[0057]将所述接口数据转为具有所述图表数据结构的数据的步骤包括:将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。
[0058]具体的,所述预设配置规则的设定方法包括:将所述接口数据的key键值属性对应到图表的key键值属性,将所述接口数据的value值对应到图表的value值。
[0059]步骤S4:采用html5 Canvas绘图技术,通过图表插件工具将具有所述图表数据结构的数据,绘画成图像。
[0060]具体的,所述图本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种将接口数据转为可视化图表方法,其特征在于,包括:获取接口数据并读取接口数据;根据客户需求确定图表的属性、处理函数对应关系和图表数据结构,将所述接口数据转为具有所述图表数据结构的数据;采用html5 Canvas绘图技术,通过图表插件工具将具有所述图表数据结构的数据,绘画成图像。2.根据权利要求1所述的将接口数据转为可视化图表方法,其特征在于,将所述接口数据转为具有所述图表数据结构的数据的步骤包括:将所述接口数据通过预设配置规则转为具有所述图表数据结构的数据。3.根据权利要求2所述的将接口数据转为可视化图表方法,其特征在于,所述预设配置规则的设定方法包括:将所述接口数据的key键值属性对应到图表的key键值属性,将所述接口数据的value值对应到图表的value值。4.根据权利要求3所述的将接口数据转为可视化图表方法,其特征在于,所述图表数据结构包括:文本图表、环形图表、折线图表、柱状图表、条状图表、表格图表、累计图表、地图图表及气泡图表数据结构中的至少一种。5.根据权利要求4所述的将接口数据转为可视化图表方法,其特征在于,当所述图表数据结构为柱状图表数据结构时,所述接口数...

【专利技术属性】
技术研发人员:邓嘉俊彭和平柒强
申请(专利权)人:广州朗国电子科技有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1