[发明专利]一种基于机器学习的可视化图表代码自动生成方法

说明书

本发明涉及一种基于机器学习的可视化图表代码自动生成方法，属于计算机科学领域。本发明针对现有技术中设计稿中图表转换成代码的难题，通过开源框架Pipcook获得设计稿中的组件元素，提炼设计稿中的组件信息和组件样式，根据组件与数据规则，修正解析图层、解析布局、解析属性的偏差，生成视图树，并通过UI2DSL输出经过各层智能化处理好的代码协议，经过协议转代码的引擎输出各种DSL代码。该方法极大地提高了设计稿中图表转换成代码的效率，而且准确率高。

技术领域

本发明属于计算机科学领域，具体涉及一种基于机器学习的可视化图表代码自动生成方法。

背景技术

随着信息化和大数据技术的不断发展，各行各业对数据深层次应用的需求逐渐增大，数据可视化技术成为了政府、企业分析、展示数据的主要方式。对于软件开发工程师，尤其是前端工程师而言，数据可视化的开发主要是将UI设计稿中的图表转换成HTML、CSS、JavaScript代码，这部分工作难度一般，但由于存在很多重复性的代码以及很多自定义元素的处理，所以比较繁琐耗时。因此，如何提升设计稿中图表转换成代码的效率，是可视化前端开发工程师急需解决的问题。

目前业界处理该问题的方法主要有两种：一是将不同的图表分模块，把每个模块的代码封装为组件，从而提升图表的可复用性，减少冗余，提高开发效率。但对于企业自身而言，开发人员的技术能力参差不齐，在多人开发的项目中，很容易导致组件碎片化、组件库维护困难以及代码冗余的问题，直接或间接的导致代码运行效率、调试效率降低。另外随着业务的发展和个性化的驱动，通用封装的图表库无法覆盖所有应用场景。二是利用各种自动化技术，把设计稿转为前端代码，减少前端工程师的工作量，从设计稿直接生成前端代码，省去中间流程，做到精度还原的同时并节约研发资源。但是该解决方案只是针对通用页面的，并不能把可视化图表转为代码。

发明内容

(一)要解决的技术问题

本发明要解决的技术问题是如何提供一种基于机器学习的可视化图表代码自动生成方法，以解决如何提升设计稿中图表转换成代码的效率的问题。

(二)技术方案

为了解决上述技术问题，本发明提出一种基于机器学习的可视化图表代码自动生成方法，该方法包括如下步骤：

步骤1：印记导入

导入文件类型符合规范的设计稿；

步骤2：组件识别

使用开源框架Pipcook，基于神经网络算法计算，对设计稿图层进行遍历，识别每一个图层，通过解析得到图层结构、模板结构和图层信息，切割标注的图表组件，获得对应的组件元素；

步骤3：样式识别

使用UI2DSL多元组件识别提取设计稿中有组件的预打标信息，提炼视图组件信息和组件样式；

步骤4：数据合并

分析节点信息、修正信息及语义化信息，根据组件与数据规则，生成数据映射信息、文本数据映射信息和状态映射信息；

步骤5：转为视图树

由操作人员控制，修正解析图层、解析布局、解析属性的偏差；除此之外，对于非组件元素、异常的视图元素进行指定规则的元素转化或者抛弃，完成后生成视图树；

步骤6：输出代码

通过UI2DSL输出经过各层智能化处理好的代码协议，经过协议转代码的引擎输出各种DSL代码。

进一步地，所述步骤1中设计稿的规范的包括标注图表的类型，标注图表的类型包括折线图、柱状图、饼图、散点图、K线图、雷达图、盒须图、热力图、关系图、路径图、树图、矩形树图、旭日图、桑葚图、漏斗图和仪表盘。