[发明专利]一种工程数据可视化低代码配置方法及系统

说明书

本发明提供了一种工程数据可视化低代码配置方法及系统，包括：根据网页显示屏的分辨率，创建与所述分辨率兼容的具有网格布局的空白页面，选取目标组件，将所述目标组件进行样式配置并拖拽到所述空白页面上得到第一页面，将每一目标组件对应的工程数据和组件参数输入到所述第一页面中，生成第二页面，运行所述第二页面，得到预览效果，根据所述预览结果对每一目标组件进行页面渲染，得到第三页面，将所述第三页面投入发布和使用，将所述第三页面投入发布和使用，可以根据显示屏幕的分辨率建立适应的网页，同时实现了数据可视化页面可配置，减少编码工作量，避免打包发布，做到及时配置实时生效。

技术领域

本发明属于工程管理领域，特别涉及一种工程数据可视化低代码配置方法及系统。

背景技术

在工程管理信息系统中，有大量数据需要以图表等不同的形式做数据可视化展现，以便管理者能够掌握工程建设概况，快速做成决策。由于客户需求差异较大，按现有的技术，一般是通过编码的方式，定制开发页面，响应客户的需求。也有一些通过配置方式，制作出数据可视化页面，响应客户需求的，不过大多无法与业务系统联动，一般做大屏展示使用，由于客户需求差异较大，通过编码方式响应客户需求的，存在设计开发工作量较大，实施成本高，建设周期较长，无法灵活快速响应的问题。现有的一些数据可视化配置方法，一般适用大屏展示，是固定分辨率，无法很好地适用不同分辨率的显示器。

因此，本发明提供了一种工程数据可视化低代码配置方法及系统。

发明内容

本发明提供一种工程数据可视化低代码配置方法及系统，用以根据显示屏幕的分辨率建立适应的网页，同时实现了数据可视化页面可配置，减少编码工作量，避免打包发布，做到及时配置实时生效。

本发明提供了一种工程数据可视化低代码配置方法，包括：

步骤1：根据网页显示屏的分辨率，创建与所述分辨率兼容的具有网格布局的空白页面；

步骤2：选取目标组件，将所述目标组件进行样式配置并拖拽到所述空白页面上得到第一页面；

步骤3：将每一目标组件对应的工程数据和组件参数输入到所述第一页面中，生成第二页面；

步骤4：运行所述第二页面，得到预览效果，根据所述预览结果对每一目标组件进行页面渲染，得到第三页面，将所述第三页面投入发布和使用。

在一种可实施的方式中，

所述步骤1包括：

步骤11：获取网页显示屏的分辨率；

步骤12：解析所述分辨率，得到所述网页显示屏纵向上第一像素点数以及横向上的第二像素点数；

步骤13：根据所述第一像素点数和第二像素点数生成网格布局，建立空白页面。

在一种可实施的方式中，

所述步骤2包括：

步骤21：获取所述空白页面的渲染风格，根据所述渲染风格建立渲染模型；

步骤22：将所述目标组件输入到所述渲染模型中进行样式渲染得到渲染目标组件；

步骤23：将所述渲染目标组件输入到所述空白页面中，建立第一页面。

在一种可实施的方式中，

所述步骤3包括：

步骤31：获取工程设备生成的初始数据包，解析所述初始数据包得到若干个初始数据；

步骤32：获取每一所述初始数据对应的数据特征，根据所述数据特征为对应的初始数据建立数据标签，根据每一数据标签对应的数据清洗规则，为每一初始数据匹配待执行数据清洗规则；