I want to add minute unit to dynamic scales but it doesn’t display properly, browser freezes. how can i solve this? my code is like below
example data date_format = “22-11-2021 14:20”
gantt.config.duration_unit = ‘minute’;
gantt.config.duration_step = 1;
gantt.config.reorder_grid_columns = true;
gantt.config.min_column_width = 50;
gantt.config.fit_tasks = true;
gantt.config.date_format = “%d-%m-%Y %H:%i”;
let zoomConfig = {
levels: [
{
name: ‘minute’,
scale_height: 70,
min_column_width: 80,
scales: [
{unit: ‘day’, step: 1, format: ‘%j %D’},
// {unit: ‘minute’, step: 30, format: ‘%i’},
]
},
{
name: ‘day’,
scale_height: 70,
min_column_width: 80,
scales: [
{unit: ‘day’, step: 1, format: ‘%j %D’},
// {unit: ‘hour’, step: 1, date: ‘%g’},
// {unit: ‘minute’, step: 30, format: ‘%i’},
]
},
{
name: ‘week’,
scale_height: 50,
min_column_width: 50,
scales: [
{
unit: ‘week’, step: 1, format: function (date) {
var dateToStr = gantt.date.date_to_str(’%d %M’);
var endDate = gantt.date.add(date, -6, ‘day’);
var weekNum = gantt.date.date_to_str(’%W’)(date);
return ‘#’ + weekNum + ‘, ’ + dateToStr(date) + ’ - ’ + dateToStr(endDate);
}
},
{unit: ‘day’, step: 1, format: ‘%j %D’}
]
},
{
name: ‘month’,
scale_height: 50,
min_column_width: 120,
scales: [
{unit: ‘month’, format: ‘%F, %Y’},
{unit: ‘week’, format: ‘Hafta #%W’}
]
},
{
name: ‘quarter’,
height: 50,
min_column_width: 90,
scales: [
{unit: ‘month’, step: 1, format: ‘%M’},
{
unit: ‘quarter’, step: 1, format: function (date) {
var dateToStr = gantt.date.date_to_str(’%M’);
var endDate = gantt.date.add(gantt.date.add(date, 3, ‘month’), -1, ‘day’);
return dateToStr(date) + ’ - ’ + dateToStr(endDate);
}
}
]
},
{
name: ‘year’,
scale_height: 50,
min_column_width: 30,
scales: [
{unit: ‘year’, step: 1, format: ‘%Y’}
]
}
]
};
gantt.ext.zoom.init(zoomConfig);
gantt.ext.zoom.setLevel(‘minute’);
gantt.config.layout = {
css: ‘gantt_container’,
cols: [
{
width: 200,
min_width: 200,
rows: [
{view: ‘grid’, scrollX: ‘gridScroll’, scrollable: true, scrollY: ‘scrollVer’},
{view: ‘scrollbar’, id: ‘gridScroll’, group: ‘horizontal’}
]
},
{resizer: true, width: 1},
{
rows: [
{view: ‘timeline’, scrollX: ‘scrollHor’, scrollY: ‘scrollVer’},
{view: ‘scrollbar’, id: ‘scrollHor’, group: ‘horizontal’}
]
},
{view: ‘scrollbar’, id: ‘scrollVer’}
]
};
gantt.i18n.setLocale(‘tr’);
gantt.config.columns = [
{name: ‘text’, label: ‘İsim’, tree: true, width: 180, resize: true},
{name: ‘partNo’, label: ‘Parça No’, align: ‘center’, width: 70, resize: true},
{name: ‘start_date’, label: ‘Başlangıç’, align: ‘center’, width: 70, resize: true},
{name: ‘end_date’, label: ‘Bitiş’, align: ‘center’, width: 70, resize: true},
{name: ‘duration’, width: 60, align: ‘center’, resize: true},
];
gantt.config.grid_resize = true;
gantt.config.order_branch = true;
gantt.plugins({quick_info: true});
gantt.init(‘gantt_here’);
gantt.parse({data: this._data});