How i Can add onclick zoom out and zoom in funtionality

Gantt React Gantt
#1

My requirement is:- when I click on the zoom out button then want to decrease the timeline column width to some 20 and when I click again then change it to 10. only want to decrease 2 levels of column width.
and when I click on zoom in then it gets back to the original width so how I can do this?

and I am using this scale in my code:-

gantt.config.scales = [
{ unit: “hour”, step: 1, date: “%H” },
{ unit: “day”, step: 1, date: “%d %M”, css: daysStyle },
];

can you guys please help me?

#2

@ramil please help me to add this functionality ramil

#3

Hello,
If you use different scale configurations, it is recommended to use the Zoom extension.
You can specify the min_column_width parameter in the zoom configuration, then it will work for the specified zoom level:
https://docs.dhtmlx.com/gantt/desktop__zoom.html#:~:text=of%20the%20scale-,min_column_width%3F%20-,-(number)%20-%20the

Here is an example:
https://snippet.dhtmlx.com/fmv6d4sp