Zum Hauptinhalt springen

timeline_cell_content

Description​

Ermöglicht das Festlegen von benutzerdefiniertem HTML-Inhalt innerhalb von Timeline-Zellen

timeline_cell_content: (task: Task, date: Date) => string | number | void;

Parameters​

  • task - (erforderlich) Task - das Objekt der Aufgabe
  • date - (erforderlich) Date - das Datum der Zelle

Returns​

  • text - (string | number | void) - ein HTML-String

Example​

gantt.templates.timeline_cell_content = function (task, date) {
    if (gantt.getTaskType(task) === "task"){
        const cost = calculateSlotCost(task, date);
        return `<div className='cost'>${demoValue}</div>`;
    }
    return "";
};

Details​

Hinweis

Sie sollten diese Vorlage anstelle der Methode addTaskLayer() verwenden, wenn Sie benutzerdefinierten Inhalt in den Zellen der Timeline anzeigen müssen. Die Implementierung ist einfacher und die Leistung schneller.

Beachten Sie, dass der benutzerdefinierte Inhalt unter den Aufgabenbalken angezeigt wird, was bedeutet, dass der Balken der Aufgaben einen höheren z-Index hat und der Inhalt der Zellen nicht sichtbar ist, wenn der Balken darüber liegt. Wenn Sie möchten, dass der Inhalt über dem Balken sichtbar ist, können Sie dem benutzerdefinierten Element 'z-index' hinzufügen:

    .cost{
        position:absolute;
        z-index: 5;
        pointer-events: none; 
    }

Change log​

  • hinzugefügt in v8.0
Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.
Need more help?Contact Support