I want to know how to get changing cell width

Gantt
#1

I am currently working on React/Meteor project which uses Gantt Chart. I have added zoom IN/Out functionality to it. Now what I am going to do is to get the pixel width of Gantt Chart cell which are changing when switch from one zoom mode to another. I am not sure what function or command I will use. Please help me!

#2

Hi @Robby10112,
Unfortunately, I am not familiar with “react”, so I may miss some specific “frameworks” things.
It’s not fully clear to me, what do you mean as “zoom IN/Out functionality”, it is some custom function you implemented, or u used one of the gantt features, as:
“zoom extension”: https://docs.dhtmlx.com/gantt/desktop__zoom.html
or
“collapse extension”: https://docs.dhtmlx.com/gantt/api__gantt_collapse.html

Anyway as there are no internal gantt methods to get the gantt container/chart width, I can suggest you get their width through simple “js” , the code may look like this:

var container = document.querySelector(".gantt_container").offsetWidth;
var fullChart = document.querySelector(".gantt_data_area").offsetWidth;
var grid = gantt.config.grid_width;
var visibleChart = container - grid;

Here is a demo(click on the container to get the gantt sizes):
http://snippet.dhtmlx.com/f0aecab96

I bound it on the click event, but you can use your zoom function for this.

#3

Thansk for support. But I have already done this. I used several ways but almost them didn’t work properly.
gantt.getTaskPosition(task, start , end); This proprly worked for me. Then this object’s width was what I wanted. Thanks for your support again.

1 Like