[发明专利]一种利用网页图形化展示项目进度的方法及系统

说明书

一种利用网页图形化展示项目进度的方法及系统，包括以下步骤：步骤1，构建基于标准甘特图的任务模型以及依赖模型；步骤2，构建基于标准甘特图的分组模型；步骤3，完成基于H5的甘特图插件设计；步骤4，完成基于标准甘特图的视图层与数据模型层的控制器设计；步骤5，完成基于标准甘特图可视化数据分析的设计，包括关键路径分析、偏差分析、层级依赖分析、时间纬度分析；步骤6，引入甘特图插件，作为第三方包在项目中安装后，与业务功能模块集成开发与部署；其系统包括有模型层、控制器、视图层；具有可配置性高、兼容性强、操作性好、方法易实现的特点。

技术领域

本发明属于项目现场进度管理技术领域，具体涉及一种利用网页图形化展示项目进度的方法及系统。

背景技术

互联网飞速发展的当下，众多用户期望可以在浏览器中通过网页浏览查看项目的进度、规划信息。传统的项目信息展示主要有两种：

1)展示项目内任务分解的层级结构，非图形化的展示，无法直观的看到项目进展的全貌以及任务的颗粒度规划细分。

2)为浏览器安装插件，利用插件绘图，以图形化的方式展示任务层级、跨度、完成情况等信息，但这种方法依赖浏览器插件，不但出错率以及安装费时，且不够通用，仅可以再windows下的浏览下安装，苹果MAC操作系统等浏览器访问就会受限。

发明内容

为克服上述现有技术的不足，本发明的目的在于提供一种利用网页图形化展示项目进度的设计方法及系统，可使用户在任何浏览器下可以像访问普通的网页一样，图形化的展示项目的进度信息，具有可配置性高、兼容性强、操作性好的特点。

为实现上述目的，本发明采用的技术方案是：

一种利用网页图形化展示项目进度的设计方法，包括以下步骤：

步骤1，构建基于标准甘特图的任务模型以及依赖模型，设计生成任务数据的基本数据结构，包括：WBS编号、计划开始结束时间、实际开始结束实际、父任务信息、清单信息、负责人信息，使得任务之间可通过WBS编号绑定前后续关联关系，通过父任务ID构建父子任务关系；

步骤2，构建基于标准甘特图的分组模型，依据步骤1所述任务模型的不同字段属性，将任务数据进行分组，并根据分组下任务数据的最早开始时间、最晚结束时间，计算出分组的时间范围，最后以分组的形式在甘特图上展示任务数据；

步骤3，完成基于H5的甘特图插件设计，甘特图插件采用原生JS、H5的技术来设计控制器、以及视图层，甘特图插件首先接收配置参数，构建甘特图实例，包含表格视图、条形图控制器，生成图形化操作界面；然后通过构建的控制器接收并处理步骤1、步骤2构建的数据模型，使任务数据能够在视图层展示，并依据任务数据的类型和状态，展示不同的操作按钮，并通过事件处理器同步不同操作引起的数据变化；

步骤4，完成基于标准甘特图的视图层与数据模型层的控制器设计，

先任务导入甘特图插件后，再依据数据模型的定义，生成对应的甘特图界面，表格组件与条形图组件之间通过数据唯一标识符id进行关联，修改其中一个组件中的数据，即可通过控制器通知另一个组件同步更新显示；

步骤5，完成基于标准甘特图可视化数据分析的设计，包括关键路径分析、偏差分析、层级依赖分析、时间纬度分析；

所述的关键路径分析：根据任务计划在时间轴上生成条形图，设置关键任务节点的里程碑，链接两个或多个任务绑定关联关系，生成存在任务依赖关系的路径，分析任务的进度，设置依赖任务的提前滞后时间，帮助有效直观的管理任务进度；

所述的偏差分析：基于任务的计划完成时间与实际完成时间，以不同颜色的条形图区分，通过可视化的方式区分时间偏差，以特定色彩定义需预警任务，辅助完成任务的进度管理与控制。