addLinkLayer

zeigt eine zusätzliche Ebene mit benutzerdefinierten Elementen für einen Link im Zeitbereich an

string addLinkLayer(LinkLayerRender | LinkLayerConfig func);

func

LinkLayerRender | LinkLayerConfig

eine Renderfunktion oder ein Konfigurationsobjekt

string

ein DOM-Element, das in der Ebene angezeigt wird

Available only in PRO Edition

Example

gantt.attachEvent("onGanttReady", function () {
    const link_types = ["FS", "SS", "FF", "SF"]
    gantt.addLinkLayer(function (link) {
        const node = gantt.getLinkNode(link.id);
        if (node){
            const el = document.createElement('div');
            el.className = 'link_layer';
            el.style.left = (node.childNodes[2].offsetLeft + 20) + 'px'
            el.style.top = (node.childNodes[2].offsetTop - 6) + 'px'
            el.innerHTML = link_types[link.type];
            return el;
        }
        return false;
    });
});

Details

Diese Funktionalität ist nur in der PRO-Edition verfügbar.

Das Argument kann folgende Typen haben:

linkLayerRender (link, timeline, config, viewport): HTMLElement|boolean|void- eine Funktion, die ein Link-Objekt als Parameter nimmt und ein DOM-Element zurückgeben muss, das in der Ebene angezeigt wird.
- link - (Link) - das Link-Objekt
- timeline? - (any) - optional, die Zeitansicht
- config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
- viewport? - (LayerViewport) - optional, das Viewport-Objekt
linkLayerConfig - (object) - das Konfigurationsobjekt für die zusätzliche Link-Ebene. Hat folgende Eigenschaften:
- id? - (string | number) - optional, die Ebenen-ID
- renderer - (object) - zwingend erforderlich, eine Funktion, die für das Rendern der Elemente der Ebene verantwortlich ist
  - render - (LinkLayerRender) - die Funktion, die das HTML-Element zurückgibt, das gerendert werden soll
  - update? - (Function): void - optional, eine Funktion, in der die gerenderten HTML-Elemente aktualisiert werden können
    - link - (Link) - das Link-Objekt
    - node - (HTMLElement) - der Container des gerenderten Knotens
    - timeline? - (any) - optional, die Zeitansicht
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - viewport? - (LayerViewport) - optional, das Viewport-Objekt
  - onrender? - (Function): void - optional, diese Funktion wird nach Abschluss des Renderns aufgerufen. Sie können sie verwenden, um native Komponenten zu rendern (zum Beispiel mithilfe der Methode ReactDOM.render)
    - link - (Link) - das Link-Objekt
    - node - (HTMLElement) - der Container des gerenderten Knotens
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Zeitachse, standardmäßig)
  - getRectangle? - (Function): { left: number, top: number, height: number, width: number } | void - optional, eine Funktion, die die Koordinaten des Viewport-Rechtecks zurückgibt
    - link - (Link) - das Link-Objekt
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Zeitachse, standardmäßig)
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - gantt? - (GanttStatic) - optional, das Gantt-Objekt
  - getVisibleRange - (Function): {start: number, end: number} | undefined | void - eine Funktion, die das Objekt mit dem sichtbaren Bereich zurückgibt
    - gantt? - (GanttStatic) - optional, das Gantt-Objekt
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Zeitachse, standardmäßig)
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - datastore? - (any) - optional, das Link-Datenbankobjekt
    - viewport? - (LayerViewport) - optional, das Viewport-Objekt
- container? - (HTMLElement) - optional, der Container der Ebene
- topmost? - (boolean) - optional, wenn wahr, wird das Element über dem Link angezeigt
- filter? - (Function): boolean - optional, eine Funktion, die ein Link-Objekt als Parameter nimmt. Wenn sie 'false' zurückgibt, wird die 'renderer'-Funktion für einen Link nicht aufgerufen
  - link - (Link) - das Link-Objekt
Vorsicht, benutzerdefinierte Ebenen werden nach dem nächsten Aufruf von gantt.init zurückgesetzt
Der Aufruf der gantt.resetLayout()-Methode setzt ebenfalls benutzerdefinierte Ebenen zurück. Damit benutzerdefinierte Ebenen auf einer Seite angezeigt werden, müssen Sie die gantt.addLinkLayer-Methode nach dem Aufruf von resetLayout erneut definieren.