利用vue绘制svg图表的方法、装置、计算机设备和存储介质与流程

文档序号:19893469发布日期:2020-02-11 12:58阅读:来源:国知局

技术特征:

1.一种利用vue绘制svg图表的方法,其特征在于,包括以下步骤:

搭建渐进式vue框架;

分别封装若干图表基础组件和若干图表容器,由此构建图标库;

定义所述图标库中每个图表基础组件和每个图表容器各自的控制参数;

接收用户图表样式需求,根据所述需求分别配置图表基础组件和图表容器;

封装所配置的图表基础组件和图表容器,并将图表数据传入图表容器,构建图表并将该图表展示给用户;

接收用户的图表交互请求,根据所述交互请求处理所述图表。

2.根据权利要求1所述的利用vue绘制svg图表的方法,其特征在于,所述接收用户图表样式需求,根据所述需求配置图表基础组件和图表容器,包括:

所述用户图表样式需求为常规图表样式,选取图标库中的图表基础组件和图表容器;

所述用户图表样式需求为自定义图表样式,配置所述控制参数构建新的图表基础组件和新的图表容器,并在所述新的图表基础组件之间插入自定义元素。

3.根据权利要求1所述的利用vue绘制svg图表的方法,其特征在于,在所述将该图表展示给用户之前,还包括:根据用户图表动画需求,配置图表动画效果,对图表所在视区进行渲染。

4.根据权利要求3所述的利用vue绘制svg图表的方法,其特征在于,所述根据用户图表动画需求,配置图表动画效果,包括:

封装常规图表动画效果以及通过flip方案新增的图表动画效果;

定义上述图表动画效果的控制参数;

所述用户图表动画需求为常规的图表动画效果,选取上述封装的图表动画效果;所述用户图表动画需求为自定义图表动画效果,配置所述图表动画效果的控制参数构建新的图表动画效果。

5.根据权利要求1所述的利用vue绘制svg图表的方法,其特征在于,根据所述交互请求处理所述图表的过程包括:

分析交互请求的对象及请求信息,所述对象包括图表基础组件、图表容器以及图表数据;所述请求信息包括修改图表基础组件的控制参数、修改图表容器的控制参数以及更新图表数据;

根据上述分析获得的交互请求的对象及请求信息,对所述图表进行处理。

6.一种利用vue绘制svg图表的装置,其特征在于,包括:

框架搭建单元,用于搭建渐进式vue框架;

图标库建立单元,用于分别封装若干图表基础组件和若干图表容器,由此构建图标库;

参数定义单元,用于定义所述图标库中每个图表基础组件和每个图表容器各自的控制参数;

图表组件配置单元,用于根据用户图表样式需求,根据图标库建立单元和参数定义单元配置图表基础组件和图表容器,并封装配置后的图表基础组件和图表容器形成图表组件;

图表构建单元,用于根据所述图表组件以及图表数据构建图表,并将该图表展示给用户;

交互单元,用于根据用户图表交互请求处理所述图表。

7.根据权利要求6所述的利用vue绘制svg图表的装置,其特征在于,该装置还包括图表渲染单元,用于对所述图表构建单元构建的图表进行动态效果渲染后展示给用户。

8.根据权利要求7所述的利用vue绘制svg图表的装置,其特征在于,所述参数定义单元还用于定义所述图表渲染单元的控制参数。

9.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至5中任一项所述方法的步骤。

10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至5中任一项所述方法的步骤。

当前第2页1 2 3 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1