盘点项目管理工具DHTMLX Gantt 的常见问题-控件新闻-慧都网

盘点项目管理工具DHTMLX Gantt 的常见问题

翻译|行业资讯|编辑：胡涛|2022-12-27 15:34:44.567|阅读 254 次

概述：盘点项目管理工具DHTMLX Gantt 使用过程中的常见问题

DHTMLX Gantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的大部分开发需求，具备完善的甘特图图表库，功能强大，价格便宜，提供丰富而灵活的JavaScript API接口，与各种服务器端技术（PHP，ASP.NET，Java等）简单集成，满足多种定制开发需求。本文给大家讲解DHTMLX Gantt的任务内容如何显示，欢迎大家下载最新版试用体验。

DHTMLX Gantt正版试用下载

一、如何打开样品

该组件的分发包括一个演示后端应用程序，可用于在本地运行示例。该应用程序需要Node.js并使用内存存储进行演示，这些演示应该在后端存储数据（即不需要数据库设置）。

您可以做什么来运行示例

1) 使用基于 Node.js 的演示后端应用程序：

将包解压到某个文件夹中
打开终端（或 cmd、PowerShell）
跑步npm install
跑步npm run start
http://localhost:9200在浏览器中打开
您应该看到与我们的在线示例相同的索引页面https://docs.dhtmlx.com/gantt/samples/

2) 使用 Apache 网络服务器

安装 Apache 网络服务器。如果您不确定如何操作，我们建议您使用XAMPP。
将甘特图示例放入 apache 文档根目录（xampp/htdocs，如果您安装了 XAMPP）。
当您运行 Apache Web 服务器时，您可以通过http://localhost/yourfolder url 访问示例。

3) 使用 IDE 中内置的开发 Web 服务器

一些 IDE 提供内置的开发 Web 服务器，
您可以查看您使用的 IDE 是否支持开箱即用或通过插件的类似功能。

为什么你可能需要它

我们包中的一些示例使用 AJAX (xhr) 从 JSON 文件加载数据。为了使其工作，必须从 Web 服务器打开一个示例。

如果您通过双击打开一个示例，它将作为一个文件被浏览器打开。在这种模式下，浏览器将阻止 AJAX 调用，组件将无法加载数据文件。您会在屏幕右上角看到无效数据弹出窗口。

为了确保所描述的行为对您的情况是真实的，您可以在浏览器的导航面板中检查 URL。如果 URL 中使用了file:///格式，例如：

file:///D:/www/gantt-eval/samples/11_resources/09_resource_histogram.html

你可以肯定是这样的。从文件加载数据的示例在此模式下不起作用。

当您从 Web 服务器打开示例时，URL 将如下所示（可以省略http:// ）：

http://localhost/gantt-eval/samples/11_resources/09_resource_histogram.html

二、甘特图未正确呈现

如果甘特图未正确呈现在页面上，请检查图表容器的 CSS 样式 - 它必须具有以像素或百分比为单位的有效大小。

如果大小以百分比定义 - 确保父容器也指定了一些高度。
如果甘特图直接放在正文中 - 指定以下 css 样式以正确使用基于百分比的高度：


html, body{
    margin:0px;
    padding:0px;
    height:100%; /*mandatory*/
    overflow:hidden;
}

三、甘特图未在 Internet Explorer 中正确呈现

如果仅在 Internet Explorer 浏览器中甘特图无法在页面上正确呈现，请确保您的页面使用完整的 DOCTYPE 声明。dhtmlxGantt 可以在 IE6、IE7 和 IE8 的标准模式下正常工作，但不适用于 IE 的怪癖模式。

例如，HTML5 DOCTYPE 是：

<!DOCTYPE html>

四、错误警报出现在右上角

dhtmlx甘特图

首先，您需要找出导致错误的原因。

当组件无法正常运行时会出现消息。它们通常表明数据或应用程序逻辑存在真正的问题。因此，简单地隐藏它们只会掩盖问题，而它可能会出现在应用程序的其他部分。

但是，您可能希望在将应用程序发送给最终用户之前禁用这些消息。在这种情况下，您可以使用show_errors配置：

gantt.config.show_errors = false;

五、甘特图不显示任何内容

有两种最明显的情况：

1. 您尝试手动或按照我们的教程实现后端 API ，但是当您打开页面时甘特图没有显示任何任务或链接。

2.您在将更改保存到后端时遇到麻烦。

阅读后端集成问题故障排除一文，其中提供了有关如何确定问题原因的说明。

六、如何将任务的最后一天纳入工期

您可能会注意到，当日期以没有小时-分钟部分的天数指定并且开始日期和结束日期相同时，任务的持续时间将计算为 0 天而不是 1 天。

让我们再考虑一个示例，其中开始日期和结束日期分别为“01-12-2021”和“05-12-2021”。这会让您认为任务应该持续 5 天（从 12 月 1 日到 5 日）。但甘特图将其持续时间计算为 4 天。

gantt.parse({ tasks: [
{
id: 1,
text: "Task 1",
start_date: "01-12-2021",
end_date: "05-12-2021"
}
]}, links:[]);

console.log(gantt.getTask(1).end_date);
// 5 December 2021 00:00:00

console.log(gantt.getTask(1).duration);
// 4

默认情况下，任务的最后一天不包括在任务的持续时间中，但可以更改默认行为并将最后一天包括在持续时间中。有关更多详细信息，请查看任务结束日期显示和包含的结束日期一文。