getTaskPosition

Description

计算任务的 DOM 元素在时间线区域的位置和大小

getTaskPosition: (task: Task, from?: Date, to?: Date) => any

Parameters

• task - (required) Task - 任务对象
• from - (optional) Date - 项目的起始日期
• to- (optional) Date - 项目的结束日期

Returns

• object - (object) - 尺寸对象

Example

// 添加基线显示
gantt.addTaskLayer(function draw_planned(task) {
    if (task.planned_start && task.planned_end) {
        const sizes = gantt.getTaskPosition(task, task.planned_start, task.planned_end); /*!*/
        const el = document.createElement('div');
        el.className = 'baseline';
        el.style.left = sizes.left + 'px';
        el.style.top = sizes.top + 'px';
        el.style.width = sizes.width + 'px';
        el.style.height= sizes.height + 'px';
        return el;
    }
    return false;
});

Related samples

• Displaying deadlines
• Display baselines

Details

此方法返回一个包含以下属性的对象:

• left - CSS中左侧位置，单位为像素
• top - CSS中顶部位置，单位为像素
• height - 条形元素的CSS高度，单位为像素（由bar_height配置或task.bar_height属性设置）
• rowHeight - 任务行的CSS高度，单位为像素（由row_height配置或task.row_height属性设置）（v7.1新增）
• width - CSS宽度，单位为像素（基于任务的开始和结束日期之间的时间段，或者如果提供了可选的'from'和'to'日期，则基于这两个日期）

如果只提供一个参数，方法将使用task.start_date和task.end_date来计算width和left。如果提供了第二和第三个参数，则使用这些日期。

请注意，该方法始终考虑日期的日期和时间部分，无论时间刻度设置如何。例如，以下两个调用:

gantt.getTaskPosition(task, new Date(2019, 3, 19, 1, 0), new Date(2019, 3, 19, 1, 0)); 
// 和
gantt.getTaskPosition(task, new Date(2019, 3, 19, 1, 0), new Date(2019, 3, 19, 5, 0));