scale_cell_class

타임라인 영역의 시간 스케일 내 셀에 할당될 CSS 클래스를 정의합니다

date

Date

셀에 해당하는 특정 날짜

Example

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

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

Related samples

work time calculations를 사용할 때, 고정값 대신 isWorkTime를 활용할 수 있습니다:

gantt.config.work_time = true;
 
gantt.templates.scale_cell_class = function(date){
    if(!gantt.isWorkTime(date))
        return true;
};

gantt.config.scales 속성을 통해 여러 스케일이 설정된 경우, 이 템플릿은 첫 번째 스케일에만 영향을 줍니다. 다른 스케일의 셀에 CSS 클래스를 할당하려면 gantt.config.scales 설정 내 css 속성을 사용하세요:

gantt.config.scales = [
    { unit: "month", step: 1, date: "%F" },
    { unit: "week", step: 1, date: "%W" },
    {
        unit: "day", step: 1, date: "%d", css: function (date) {             if (!gantt.isWorkTime({ date: date })) {                 return "weekend";             }         }     },
];

Back to top