甘特图组件DHTMLX Gantt示例 - 如何有效管理团队工作时间?(一)

如果没有有效的时间管理工具,如工作时间日历,很难想象一个项目如何成功运转。这就是为什么我们的开发团队非常重视项目管理,并提供了多种选择来安排DHTMLX Gantt的工作时间。使用DHTMLX Gantt这个JavaScript库,您可以创建一个强大的甘特图,并用一个或多个工作时间日历来补充它。

在本文中,我们将回顾如何在Web项目中使用DHTMLX Gantt工作日历功能的有趣示例。

DHTMLX Gantt正式版下载

DHTMLX Gantt中工作日历背后的关键概念

首先,让我们考虑一下甘特图组件是如何处理日期和日历的。

默认情况下,当禁用work_time选项时,任务的持续时间取决于duration_unit参数和任务日期(开始和结束),而工作和非工作时间将被忽略。在这种情况下,就像在MS Project中一样,使用了全时日历。

如果启用了work_time选项,并且没有更改其他选项,则Gantt开始考虑工作时间。换句话说,根据预定义的设置,周末/节假日被视为完全不工作,工作时间从早上8点到下午5点,午休时间为1小时。

从表面上看,Gantt似乎已经开始利用工作时间,但实际上,它利用了一个应用于所有任务的全局日历,该日历的设置是通过setWorkTime方法指定的。

此外,还可以为每个任务或任务组设置单独的工作时间设置,这是在自定义日历的帮助下实现的。使用createCalendar和addCalendar方法创建这样一个日历,要将此日历分配给某个任务,必须在任务对象的calendar_id参数中指定日历的ID。

综上所述,我们可以区分出在甘特图项目中使用工作时间功能的三种方式:

  • 全时日历
  • 全局日历
  • 自定义日历

利用丰富的DHTMLX Gantt API,您可以使用工作日历做很多有用的事情。

甘特图组件DHTMLX Gantt示例图

例如,可以将工作日历分配给特定的任务、资源(如上图所示)或项目。除此之外,我们的dhtmlxGantt组件允许对一个日历中的特定时间段应用不同的工作时间规则,将多个日历合并为一个日历,并动态更改它们。

工作时间日历的用例

现在我们继续在实际场景中使用DHTMLX Gantt的工作时间日历功能的实际示例。

在全局日历中设置周末/节假日

在DHTMLX Gantt中,有几种方法可以指定工作是回见设置。以一种简单的方式,应用setWorkTime方法就足够了。

该方法接受一个参数 - worktime配置对象,它具有以下属性:

  • date – 将应用工作时间的日历日期,必须是js[Date object]。
  • day – 工作日编号,取值范围为0 ~ 6之间的数字,周日为0,周一为1,以此类推。
  • hours – 工作时间设置,该值可以是“true”、“false”或工作时间数组。

该对象必须包含日期和小时或日和小时属性,这些属性允许将工作时间规则设置为特定的星期或特定的日期。

考虑一下这些例子:

– 将9月1日定为节假日:

gantt.setWorkTime({
date:new Date(2021,8,1),
hours:false
});

– 设置9月1日的自定义工作时间:

gantt.setWorkTime({
date:new Date(2021,8,1),
hours: ["8:00-11:00", "12:00-14:00"]
});

– 将星期日定为工作日,采用全局工作时间;

gantt.setWorkTime({
day: 0,
hours: true
});

– 星期五的工作时间:

gantt.setWorkTime({
day: 5,
hours: ["8:00-10:00"]

日期可以存储在服务器上,然后加载到甘特图项目中。下面的示例包含一个日期数组,在使用此数组中的日期之前,必须将它们从字符串格式转换为日期格式。之后可以在setWorkTime方法中使用日期,因此非工作日从数组中取出并应用于所有任务。

甘特图组件DHTMLX Gantt示例图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/133376.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java架构师缓存架构设计解决方案

目录 1 缓存常见的三大问题1.1 缓存雪崩1.2 缓存穿透1.3 缓存击穿2 缓存key的生成策略3 热点数据集中失效的问题4 如何提高缓存的命中率5 缓存和数据库双写不一致的问题6 如何对缓存数据进行分片1 缓存常见的三大问题 缓存雪崩、缓存穿透和缓存击穿是缓存系统中常见的三大问题,…

日常学习记录随笔-大数据之日志(hadoop)收集实战

数据收集(nginx)--->数据分析---> 数据清洗--->数据聚合计算---数据展示 可能涉及到zabix 做任务调度我们的项目 电商日志分析 比如说我们现在有一个系统,我们的数仓建立也要有一个主题 我这个项目是什么我要干什么定义方向 对用户进行分析,用户信息 要懂整个数据的流…

理解LoadRunner,基于此工具进行后端性能测试的详细过程(上)

1、LoadRunner 的基本原理 后端性能测试工具通过虚拟用户脚本生成器生成基于协议的虚拟用户脚本,然后根据性能测试场景设计的要求,通过压力控制器控制协调各个压力产生器以并发的方式执行虚拟用户脚本,并且在测试执行过程中,通过…

【手写数字识别】数据挖掘实验二

文章目录 Ⅰ、项目任务要求任务描述:主要任务要求(必须完成以下内容但不限于这些内容): II、实现过程数据集描述实验运行环境描述KNN模型决策树模型朴素贝叶斯模型SVM模型不同方法对MNIST数据集分类识别结果分析(不同方法识别对比率表及结果分析) 完整代…

2023最新pytorch安装教程,简单易懂,面向初学者(Anaconda+GPU)

一、前言 目前是2023.1.27,鉴于本人安装过程中踩得坑,安装之前我先给即将安装pytorch的各位提个醒,有以下几点需要注意 1.判断自己电脑是否有GPU 注意这点很重要,本教程面向有NVIDA显卡的电脑,如果你的电脑没有GPU或者使用AMD显…

2023-10-12 LeetCode每日一题(找出数组的串联值)

2023-10-12每日一题 一、题目编号 2562. 找出数组的串联值二、题目链接 点击跳转到题目位置 三、题目描述 给你一个下标从 0 开始的整数数组 nums 。 现定义两个数字的 串联 是由这两个数值串联起来形成的新数字。 例如,15 和 49 的串联是 1549 。 nums 的 串…

QT运行界面与画布大小不一致问题(一步到位)

QT运行界面与画布大小不一致问题 出现的问题直接设置环境变量main函数中输入以下代码更改系统缩放比好了,看一下运行结果吧 出现的问题 当我们运行程序时,发现运行出来的大小和设计的几面大小有很大的差别,这使我们开发起来就特别的困难&…

iOS 面试题以及自我理解答案

1、简述push原理,push的证书和其他的有什么不一样? 第 一阶段:BeejiveIM服务器把要发送的消息、目的iPhone的标识打包,发给APNS。 第二阶段:APNS在自身的已注册Push服务 的iPhone列表中,查找有相应标识的iP…

数字孪生技术:新零售的未来之路

随着科技的不断进步,新零售产业正经历着巨大的变革。数字孪生作为一种新兴技术正在加速这一变革的进程。它不仅为新零售企业带来了更高效的运营方式,还为消费者提供了更个性化、便捷的购物体验。那么,数字孪生技术究竟如何在新零售产业中发挥…

angular项目指定端口,实现局域网内ip访问

直接修改package.json文件 "dev": "ng serve --host 0.0.0.0 --port 8080"终端运行npm run dev启动项目。 这里就指定了使用8080端口运行项目,同时局域网内的其他电脑可以通过访问运行项目主机的ip来访问项目 例如项目运行在ip地址为192.168.2…

BI工具:让数据分析井然有序一望而知

BI(Business Intelligence)工具是一类专门用于数据分析和决策支持的软件工具。 它们能够将企业内部和外部的数据进行整合、处理和可视化,帮助用户从海量数据中获取有价值的见解和洞察,并以直观、易懂的方式展示给决策者和相关人员…

当涉及到API接口数据分析时,主要可以从以下几个方面展开

当涉及到API接口数据分析时,主要可以从以下几个方面展开: 请求分析:可以统计每个API接口的请求次数、请求成功率、失败率等基础指标。这些指标可以帮助你了解API接口的使用情况,比如哪个API接口被调用的次数最多,哪个…