Find date based on mouse position

Gantt
#1

I am attempting to find the date that the mouse is currently pointed at on the Gantt chart.

The reason is for zooming functionality. Using the example for zoom, when I zoom in, the new center doesn’t seem to make sense. So instead i would like to find the current mouses location and use that as the new center. Similar to how scheduler getActionData works.

Thanks.

#2

Hi,

You need to use dateFromPos method to get the date of the specified horizontal position in the chart area.

Please check demo how it can be implemented:
http://docs.dhtmlx.com/gantt/snippet/05759f24

1 Like
#3

Works like a charm… thank you

#4

Hi Polina,
Your method works well if the gantt chart and resource view are both displayed.
However, when I have only a resource view displayed, e.clientX returns a different value and the position is incorrectly offset.
What can I do to ensure e.clientX returns the same value in both cases?

#5

Hi @daver,

I tried to reproduce the issue using this sample, you can run it locally with your Gantt package. As I see, e.clientX returns correct values when you move the mouse.

The issue is related to the dateFromPos method. In the current implementation, it provides the opportunity to get the date of the specified horizontal position only in the chart area and doesn’t work if you use Resource view panel without the chart.

I will add this query into our internal tracker so that it will be implemented it in the future.
Thank you for the message. I will notify you here when it will be ready.

#6

Hi Polina,

I added your onMouseMove function to the code snippet at https://snippet.dhtmlx.com/5/191044f12
and then examined what happened to e.clientX when I removed the gantt row from the config.layout.
There are two errors in fact.
The calculation for position subtracts the config grid width when it needs to consider the resource grid width.
And, yes, whatever value is passed to dateFromPos returns the same incorrect date.

I look forward to hearing when the dateFromPos fix is implemented.

#7

Hello David,
The dev team added the getLayoutView method:
https://docs.dhtmlx.com/gantt/api__gantt_getlayoutview.html

So, now you can use the posFromDate and dateFromPos methods from the resource load and histogram timeline cells. And it will work even when the main timeline is not displayed.

You can see how it works in the following sample:
http://snippet.dhtmlx.com/5/5be4f6aa4