Zeitfenster hervorheben

Um die Aufmerksamkeit des Benutzers auf bestimmte Zeitfenster zu lenken, können Sie sie hervorheben.

• Um eine Zelle des Timeline-Bereichs hervorzuheben, verwenden Sie die Vorlage timeline_cell_class.
• Um eine Zelle der Timeline-Zeitskala hervorzuheben, verwenden Sie die Vorlage scale_cell_class.

Die Vorlage ist eine Funktion, die alle Datumswerte durchläuft und die angegebene CSS-Klasse auf die entsprechenden Zellen anwendet.

Beispielsweise können Sie Wochenenden hervorheben, um die Skala visuell in Wochen zu unterteilen:

<style>
.weekend{ background: #f4f7f4 !important;}
</style>

gantt.templates.scale_cell_class = function(date){
    if(date.getDay()==0||date.getDay()==6){
        return "weekend";
    }
};
gantt.templates.timeline_cell_class = function(task,date){
    if(date.getDay()==0||date.getDay()==6){ 
        return "weekend" ;
    }
};
gantt.init("gantt_here");

Beachten Sie, dass, während Sie Berechnungen der Arbeitszeit verwenden, Sie statt harter Werte auch isWorkTime verwenden können:

gantt.config.work_time = true;

gantt.templates.scale_cell_class = function(date){
    if(!gantt.isWorkTime(date)){
        return "weekend";
    }
};
gantt.templates.timeline_cell_class = function(task,date){
    if(!gantt.isWorkTime({task:task, date:date})){
        return "weekend" ;
    }
};
gantt.init("gantt_here");

Highlighting weekends

Hinweis

Verwenden Sie das Stichwort 'important', um sicherzustellen, dass die angegebene CSS-Eigenschaft auf die Zelle angewendet wird.