Hello,
When i highlight color of day(hilight on weekend), it’s also apply on month. (See screenshot)
I use subscales to display day & month.
Here is my Js code :
scale_zoom: function(value) {
gantt.config.step = 1;
gantt.config.min_column_width = 50;
gantt.config.scale_height = 50;
gantt.templates.scale_cell_class = function(date) {
if(date.getDay() == 0 || date.getDay() == 6) return “weekend_scale”;
};
gantt.templates.task_cell_class = function(item, date) {
if(date.getDay() == 0 || date.getDay() == 6) return “weekend_task”;
};
gantt.templates.date_scale = null;
switch (value) {
case “day”:
gantt.config.scale_unit = “day”;
gantt.config.date_scale = “%d %M”;
gantt.config.subscales = [];
gantt.config.scale_height = 27;
break;
case “week”:
var weekScaleTemplate = function(date){
var dateToStr = gantt.date.date_to_str(“%d %M %Y”);
var endDate = gantt.date.add(gantt.date.add(date, 1, “week”), -1, “day”);
return dateToStr(date) + " - " + dateToStr(endDate);
};
gantt.config.scale_unit = “week”;
gantt.templates.date_scale = weekScaleTemplate;
gantt.config.subscales = [
{unit:“day”, step:1, date:“%d, %D” }
];
break;
case “month”:
gantt.config.scale_unit = “month”;
gantt.config.date_scale = “%F, %Y”;
gantt.config.subscales = [
{unit:“day”, step:1, date:“%d” }
];
gantt.config.min_column_width = 25;
break;
case “year”:
gantt.config.scale_unit = “year”;
gantt.config.date_scale = “%Y”;
gantt.config.subscales = [
{unit:“month”, step:1, date:“%M” }
];
gantt.templates.scale_cell_class = function(date) {};
gantt.templates.task_cell_class = function(item, date) {};
break;
}
},
Proper indentation code(sorry for previous code)
scale_zoom: function(value) {
gantt.config.step = 1;
gantt.config.min_column_width = 50;
gantt.config.scale_height = 50;
gantt.templates.scale_cell_class = function(date) {
if(date.getDay() == 0 || date.getDay() == 6) return "weekend_scale";
};
gantt.templates.task_cell_class = function(item, date) {
if(date.getDay() == 0 || date.getDay() == 6) return "weekend_task";
};
gantt.templates.date_scale = null;
switch (value) {
case "day":
gantt.config.scale_unit = "day";
gantt.config.date_scale = "%d %M";
gantt.config.subscales = [];
gantt.config.scale_height = 27;
break;
case "week":
var weekScaleTemplate = function(date){
var dateToStr = gantt.date.date_to_str("%d %M %Y");
var endDate = gantt.date.add(gantt.date.add(date, 1, "week"), -1, "day");
return dateToStr(date) + " - " + dateToStr(endDate);
};
gantt.config.scale_unit = "week";
gantt.templates.date_scale = weekScaleTemplate;
gantt.config.subscales = [
{unit:"day", step:1, date:"%d, %D" }
];
break;
case "month":
gantt.config.scale_unit = "month";
gantt.config.date_scale = "%F, %Y";
gantt.config.subscales = [
{unit:"day", step:1, date:"%d" }
];
gantt.config.min_column_width = 25;
break;
case "year":
gantt.config.scale_unit = "year";
gantt.config.date_scale = "%Y";
gantt.config.subscales = [
{unit:"month", step:1, date:"%M" }
];
gantt.templates.scale_cell_class = function(date) {};
gantt.templates.task_cell_class = function(item, date) {};
break;
}
},
scale_zoom: function() {
gantt.config.step = 1;
gantt.config.min_column_width = 50;
gantt.config.scale_height = 50;
gantt.templates.scale_cell_class = function(date) {
if(date.getDay() == 0 || date.getDay() == 6) return "weekend_scale";
};
gantt.templates.task_cell_class = function(item, date) {
if(date.getDay() == 0 || date.getDay() == 6) return "weekend_task";
};
gantt.config.scale_unit = "month";
gantt.config.date_scale = "%F, %Y";
gantt.config.subscales = [
{unit:"day", step:1, date:"%d" }
];
gantt.config.min_column_width = 25;
},
Hi,
the subscales can have their own css templates, and if one is not defined - subscale uses one defined in templates.scale_cell_class.
Try this config: gantt.templates.scale_cell_class = function(date) {};
gantt.config.scale_unit = "month";
gantt.config.date_scale = "%F, %Y";
gantt.config.subscales = [
{unit:"day", step:1, date:"%d", css:function(date) {
if(date.getDay() == 0 || date.getDay() == 6) return "weekend_scale";
} }
];
Thank you very much, it’s work