项目管理工具dhtmlxGantt入门教程(二):初始dhtmlxGantt(上)(dhtmlxGantt开源版)

当您使用 dhtmlxGantt 开发应用程序时,您需要做的第一件事就是初始化,或者简单地说,就是在页面上显示甘特图

DHTMLX Gantt官方最新版免费下载试用,历史版本下载,在线文档和帮助文件下载-慧都网

要在页面上显示基本甘特图,请执行 3 个步骤:

  1. 在页面上包含dhtmlxGantt 代码文件。
  2. 在页面上创建一个 DIV 容器。
  3. 使用init方法在新创建的容器中初始化 dhtmlxGantt 。作为参数,该方法采用将在其中显示甘特图的 HTML 容器(或其 id)。

<!DOCTYPE html><html><head> <script src="codebase/dhtmlxgantt.js"></script> <link href="codebase/dhtmlxgantt.css" rel="stylesheet"></head><body> <div id="gantt_here" style='width:1000px; height:400px;'></div> <script type="text/javascript"> gantt.init("gantt_here"); </script></body></html>

如何将甘特图源文件添加到项目中

您可以通过多种方式将甘特代码文件添加到您的项目中,具体取决于您创建的应用程序的类型:

  • 通过 <script> 标签包含文件
  • 将文件导入 ES6/7 和 TypeScript 应用程序
  • 将文件包含到基于 RequireJS 的应用程序中

通过 <script> 标签包含文件

dhtmlxGantt 需要在页面上包含 2 个代码文件:

  • dhtmlxgantt.js
  • dhtmlxgantt.css

<script src="codebase/dhtmlxgantt.js"></script><link href="codebase/dhtmlxgantt.css" rel="stylesheet">

让我们快速浏览一下 dhtmlxGantt 包的结构,找出在哪里查找文件。

构成 dhtmlxGantt 包的主要文件夹和文件有:

  • sources – 库的源代码文件。这些文件未缩小且易于阅读。该软件包主要用于组件的调试。
  • 示例- 代码示例。
  • docs – 组件的完整文档。
  • codebase – 库的打包代码文件。这些文件的大小要小得多,旨在用于生产。在您的应用程序中,您需要使用此文件夹中的文件。

将文件导入 ES6/7 和 TypeScript 应用程序

使用以下命令导入文件:

import { gantt } from 'dhtmlx-gantt';

对于 Commercial、Enterprise 或 Ultimate 版本,命令如下所示:

import { gantt, Gantt } from 'dhtmlx-gantt';

dhtmlxGantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表,可满足项目管理应用程序的所有需求,是最完善的甘特图图表库。了解更多DhtmlxGantt相关内容,请锁定本套系列教程。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

(1)
上一篇 2022年11月3日 上午8:18
下一篇 2022年11月4日 上午8:00

相关推荐

  • 建设银行惠懂你网银版操作指南以及常见问题处理(建行惠懂你操作手册)

    大家好!我是老舒,今天分享的是建设银行企业快贷的操作指南以及常见的问题汇总 常见问题解答? 问题一:内控有哪四种原因? 问题二:认证不上企业怎么回事呢?客户刚刚变更的执照。 问题三…

    科研百科 2023年3月31日
    2.1K
  • 2018年度党建工作总结——党建工作计划制定执行情况(2018年党建工作计划怎么写)

    年初以来,佳木斯日报社党委坚持以习近平新时代中国特色社会主义思想为指导,深入学习贯彻党的十九大精神,习近平总书记在我省考察工作时重要讲话和指导精神,省委十二届三次全会、市委十三届四…

    科研百科 2023年2月27日
    194
  • 项目管理系统 在线

    项目管理系统在线 项目管理系统是一种能够帮助组织管理项目的工具,它可以帮助团队更有效地协作,提高项目管理的效率和质量。在线项目管理系统则是指那些可以在网络环境下使用的软件系统,它们…

    科研百科 2024年7月15日
    54
  • 项目管理系统 采购

    项目管理系统在采购管理中发挥着重要的作用。采购流程是项目成功的关键因素之一,项目管理系统可以提供各种工具和技术,帮助采购人员更有效地管理项目采购流程。本文将介绍项目管理系统在采购管…

    科研百科 2024年8月18日
    41
  • 化妆品科研项目ppt

    化妆品科研项目PPT的开头语: 随着时代的变迁,人们对于美的追求也越来越多元化。化妆品作为满足人们美丽需求的一种重要产品,已经成为人们生活中不可或缺的一部分。但是,目前市面上的化妆…

    科研百科 2025年3月31日
    2
  • 浪潮开源低代码平台

    浪潮开源低代码平台:推动企业数字化转型的新引擎 随着信息技术的快速发展,企业数字化转型已成为当今商业领域的热门话题。为了适应市场竞争的激烈程度,企业需要不断创新和优化业务流程,提高…

    科研百科 2024年2月26日
    157
  • 以科研项目为依托

    科研项目为依托的文章示例如下: 近年来,随着科技的不断发展,科研项目已经成为了科学家们研究未知领域的重要工具。科研项目的开展不仅能够推动科学技术的进步,还能够为人们提供新的研究方向…

    科研百科 2025年2月24日
    0
  • 南京中医药大学孙秀兰

    南京中医药大学孙秀兰教授 南京中医药大学孙秀兰教授是一位备受尊敬的学者,她在中医药领域做出了卓越的贡献。她毕业于中国中医科学院,并获得了南京中医药大学的博士学位。在多年的研究生涯中…

    科研百科 2024年11月9日
    7
  • 国网红山区供电公司网格化管理促“零距离”服务(供电公司网格化管理实施方案)

    来源:赤峰日报-塞外赤峰 本报讯 (记者 宋玉静) 为进一步加强基层党组织建设和党建创新工作,不断提升服务质量和效率,国网红山区供电公司积极推行网格化管理,形成党群协同、网格协同、…

    科研百科 2023年6月9日
    623
  • 蔬菜所2个南瓜新品种通过鉴定

        7月8日,北京市种子管理站组织有关专家对中国农业科学院蔬菜花卉研究所南瓜课题组选育的“北蜜1号”与“中栗6…

    科研百科 2022年5月16日
    303