一种基于vue框架的大数据流图处理方法技术

本发明专利技术公开了一种基于vue框架的大数据流图处理方法，包括步骤1：基于业务需求，在服务器端构建所需的功能节点；步骤2：用户由前端Vue页面登录，根据需要绘制的流图，从服务器端获取相应的功能节点；步骤3：为每个功能节点进行鼠标事件设置；步骤4：采用绘图插件中的线条对经过步骤3设置的功能节点进行组装，得到组装好的功能节点和连线数据；步骤5：将组装好的功能节点和连线数据通过vue框架打包发布给服务器端。

A big data flow graph processing method based on Vue framework

【技术实现步骤摘要】
一种基于vue框架的大数据流图处理方法
本专利技术属于流图绘制
，具体涉及一种基于vue框架的大数据流图处理方法。
技术介绍
在大数据业务平台中，数据流图的使用是一个非常重要的方向。通过配置流图用户可直观感受数据流转，了解数据处理流程。目前在Web端比较常见的流图技术都是基于拓扑图实现的，在开源拓扑项目上，借助于拓扑本身提供的节点和连线功能完成流图绘制，绘制同时提供数据配置，进而支持大数据流图应用。在目前现有的前端技术中，经常通过使用可以实现拓扑的组件完成流图绘制，比如常见的有jTopo，jTopo主要是通过使用HTML5Canvas技术完成拓扑化图形界面。依赖于拓扑图形进而实现流图绘制。在拓扑中提供基础的组件如节点、连线，再通过在Canvas中对组件进行添加、删除、修改，从而实现图形绘制，绘制好的图形可以表示对应的流图。但是在Web端追求视觉效果及操作简易的目标驱动下，用拓扑打造流图的方案显得有些笨拙。在用户使用过程中由于流图经常需要进行节点间连线，目前已有的技术经常采用的是添加一条线，指定起点和终点。这样的方式显然从用户操作角本文档来自技高网...

【技术保护点】
1.一种基于vue框架的大数据流图处理方法，其特征在于：包括以下步骤：/n步骤1：基于业务需求，在服务器端构建所需的功能节点；/n步骤2：用户由前端Vue页面登录，根据需要绘制的流图，从服务器端获取相应的功能节点信息；/n步骤3：为每个功能节点进行鼠标事件设置，所述鼠标事件包括鼠标移动mousemove；/n步骤4：借助鼠标移动事件在用户操作时绘制线条，将线条和步骤3中设置的功能节点建立对应关系，得到组装好的功能节点和连线数据；/n步骤5：将组装好的功能节点和连线数据发送给服务器端进行保存。/n

【技术特征摘要】
1.一种基于vue框架的大数据流图处理方法，其特征在于：包括以下步骤：
步骤1：基于业务需求，在服务器端构建所需的功能节点；
步骤2：用户由前端Vue页面登录，根据需要绘制的流图，从服务器端获取相应的功能节点信息；
步骤3：为每个功能节点进行鼠标事件设置，所述鼠标事件包括鼠标移动mousemove；
步骤4：借助鼠标移动事件在用户操作时绘制线条，将线条和步骤3中设置的功能节点建立对应关系，得到组装好的功能节点和连线数据；
步骤5：将组装好的功能节点和连线数据发送给服务器端进行保存。


2.根据权利要求1所述的一种基于vue框架的大数据流图处理方法，其特征在于：所述步骤3中的为每个功能节点进行鼠标事件设置，包括：
对每个功能节点设置锚点信息，得到对应的锚点；<...

【专利技术属性】
技术研发人员：边雁，邹庆，韩晓，黄昆，马德超，岳伟瑞，陈月燕，潘晨，刘乐，柴生，
申请(专利权)人：国电南瑞科技股份有限公司，国电南瑞南京控制系统有限公司，
类型：发明
国别省市：江苏;32