addLinkLayer

zeigt eine zusätzliche Ebene mit benutzerdefinierten Elementen für Links im Timeline-Bereich an

string addLinkLayer(LinkLayerRender | LinkLayerConfig func);

func

LinkLayerRender | LinkLayerConfig

eine Renderfunktion oder ein Konfigurationsobjekt

string

ein DOM-Element, das die Ebene repräsentiert, die 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 Funktion ist nur in der PRO-Edition verfügbar.

Das Argument kann einer der folgenden Typen sein:

linkLayerRender (link, timeline, config, viewport): HTMLElement|boolean|void - eine Funktion, die ein Link-Objekt erhält und ein DOM-Element zurückgibt, das in der Ebene angezeigt wird.
- link - (Link) - das Link-Objekt
- timeline? - (any) - optional, die Timeline-Ansicht
- config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
- viewport? - (LayerViewport) - optional, das Viewport-Objekt
linkLayerConfig - (object) - Konfigurationsobjekt für die zusätzliche Link-Ebene mit folgenden Eigenschaften:
- id? - (string | number) - optional, die Layer-ID
- renderer - (object) - erforderlich, ein Objekt, das für das Rendern der Layer-Elemente zuständig ist
  - render - (LinkLayerRender) - Funktion, die das zu rendernde HTML-Element zurückgibt
  - update? - (Function): void - optional, eine Funktion zum Aktualisieren der gerenderten HTML-Elemente
    - link - (Link) - das Link-Objekt
    - node - (HTMLElement) - Container des gerenderten Knotens
    - timeline? - (any) - optional, die Timeline-Ansicht
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - viewport? - (LayerViewport) - optional, das Viewport-Objekt
  - onrender? - (Function): void - optional, wird nach Abschluss des Renderns aufgerufen, nützlich zum Rendern nativer Komponenten (z.B. mit ReactDOM.render)
    - link - (Link) - das Link-Objekt
    - node - (HTMLElement) - Container des gerenderten Knotens
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Standard: timeline)
  - getRectangle? - (Function): { left: number, top: number, height: number, width: number } | void - optional, gibt die Koordinaten des Viewport-Rechtecks zurück
    - link - (Link) - das Link-Objekt
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Standard: timeline)
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - gantt? - (GanttStatic) - optional, die Gantt-Instanz
  - getVisibleRange - (Function): {start: number, end: number} | undefined | void - optional, gibt das sichtbare Bereichsobjekt zurück
    - gantt? - (GanttStatic) - optional, die Gantt-Instanz
    - view? - (any) - optional, die Layout-Zelle, in der die Ebene hinzugefügt wird (Standard: timeline)
    - config? - (GanttConfigOptions) - optional, das Gantt-Konfigurationsobjekt
    - datastore? - (any) - optional, das Link-Datastore-Objekt
    - viewport? - (LayerViewport) - optional, das Viewport-Objekt
- container? - (HTMLElement) - optional, das Container-Element für die Ebene
- topmost? - (boolean) - optional, wenn true, erscheint das Layer-Element über dem Link
- filter? - (Function): boolean - optional, eine Funktion, die ein Link-Objekt erhält und false zurückgibt, um das Rendern für diesen Link zu überspringen
  - link - (Link) - das Link-Objekt
Beachten Sie, dass benutzerdefinierte Layer nach erneutem Aufruf von gantt.init gelöscht werden
Außerdem setzt ein Aufruf von gantt.resetLayout() benutzerdefinierte Layer zurück. Um sie sichtbar zu halten, müssen Sie gantt.addLinkLayer nach dem Aufruf von resetLayout erneut anwenden.