kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hii ..
I am Creating Gantt Chart Finding solution for if i click on Day button Gantt should should display Current date data ,similar for week if i am click on Week Button only Current Week data should display ,is same for Month (I am Using renhSelector Button)



Thanks
Kanti
jedrzej.r
Posts: 712
Joined: Tue Jan 24, 2023 11:21 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hi!

Welcome to our forum and thanks for getting in touch with us!

In order to achieve such functionality, you can create your own array of rangeSelector buttons and override click event by setting desired x-axis extremes and return false, so that the default event action isn't emitted.

Demo: https://jsfiddle.net/BlackLabel/yu2e1kxr/

API:
https://api.highcharts.com/gantt/rangeSelector.buttons
https://api.highcharts.com/gantt/rangeS ... ents.click
https://api.highcharts.com/class-refere ... etExtremes

Let me know if that was what you were looking for!
Best regards!
Jędrzej Ruta
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hii...
Thanks for response,
I have another question , Create HIghchart Gantt with add three buttons Day, Week and Month if user Click on the Day button the Current day display with 00 to 24 hours on X-axies ,and if user click on the Week button the current week should display (eg. current week 20 aug, 21 aug .....26 aug) same like if click on moth button current month should display.

Thanks
kanti
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Display current day 0 to 24 hours on x-axies if click or selected Day button

Hii..
How to create Gantt chart to display current day 0 to 24hours on x-axies when click on selected Day button and should not display 0 to 24 hours when click or selected Week or Month button for Week if user click or selected week button chart should display current week and for Month if user click or selected Month button chart should display current Month.






Thanks
kanti
jedrzej.r
Posts: 712
Joined: Tue Jan 24, 2023 11:21 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

In order to display hourly labels on the x-axis when clicking day button, you can update chart x-axis with tickInterval set to hourly rate. Also, i forgot to mention in my previous post that for selecting a day range, you'd have to adjust the xAxis.minRange, since by default it is set as a 5 times interval between two closest, making it impossible to select a smaller date range.

Demo: https://jsfiddle.net/BlackLabel/jkanbhew/

API:
https://api.highcharts.com/class-refere ... art#update
https://api.highcharts.com/highcharts/xAxis.minRange
https://api.highcharts.com/highcharts/x ... ckInterval

Let me know if you have any further questions!
Best regards!
Jędrzej Ruta
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Thank you ..
get it what i am looking for ..
one issue with this after click on Week and Month button the vertical lines come up ,added file please check .
i need replace those vertical line with weekdays and above that weeks

its working for Day button what i am looking for

thanks
kantilal
Attachments
ganttchart.JPG
ganttchart.JPG (62.03 KiB) Viewed 2679 times
jedrzej.r
Posts: 712
Joined: Tue Jan 24, 2023 11:21 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Indeed, when switching from day to other range, the tickInterval was updated only on this particular axis, where it should be applied to whole Highcharts.Axis object. Take a look at below implementation to see it in action.

Demo: https://jsfiddle.net/BlackLabel/v4zbayhq/

API:
https://api.highcharts.com/gantt/xAxis. ... etExtremes
https://api.highcharts.com/class-refere ... xis#update

Let me know if that was what you were looking for!
Best regards!
Jędrzej Ruta
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hii...thanks for response

I have issue with in the Month view i want start week of month view with Sunday currently it it showing Monday and other two view remain same .
can you please help.

Code: https://jsfiddle.net/v0kujefn/1/

files are attached.

Thanks
Attachments
updated month view.jpg
updated month view.jpg (81.4 KiB) Viewed 2653 times
Week View.JPG
Week View.JPG (84.08 KiB) Viewed 2653 times
Day view.JPG
Day view.JPG (72.61 KiB) Viewed 2653 times
jakub.j
Posts: 1091
Joined: Tue Jan 24, 2023 11:14 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hey!

Gantt chart has 2 x-axis, the weekdays are on the second one, so if you set xAxis.startOFWeek to 0, the week will start on Sunday, see:

Demo: https://jsfiddle.net/BlackLabel/9znt0wfc/

Let me know if you have any further questions!
Kind regards
Jakub
Jakub
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Thanks for response ..

I have another question How can add Drag and drop functionality on the chart.
I am able to show the data on chart but related all records getting populated on the one Row only .
Want to show if Resouces1 have 3 tasks want show this resouces1 should display 3 task .


I am using this chart : https://jsfiddle.net/BlackLabel/jpq8bt4d/

Thanks in advance .
jedrzej.r
Posts: 712
Joined: Tue Jan 24, 2023 11:21 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Unfortunately, for now there isn't any option to put tasks parallel in one row due to inability of setting different height for each row. There are already similar threads regarding this functionality across forum: viewtopic.php?f=19&t=51280.

In this thread you will find a simple workaround, which uses yAxis.breaks and point graphic translation in order to allow expanding one rows' height and gathering points parallely. For applying the drag and drop functionality, it would require a further customization by e.g. overriding draggable-points module.

If you believe that such option should be included in Highcharts Gantt, you can post a feature request on GitHub repository: https://github.com/highcharts/highchart ... .md&title=. The more people that upvote, the closer we are to seeing this idea become a reality.

Demo: https://jsfiddle.net/BlackLabel/x79ufn3w/

API:
https://api.highcharts.com/gantt/yAxis.breaks
https://api.highcharts.com/class-refere ... #translate
https://api.highcharts.com/class-refere ... xis#update

Let me know if you have any more questions!
Best regards!
Jędrzej Ruta
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hi ...thanks for response

i have issue with drag and drop gantt chart ..all shift record showing on in one resource only .
it is possible to assign shift record to particular resource?

Would you please provide how to dynamically provide data on the drag and drop gantt chart

exam .code :https://jsfiddle.net/gup2kcsh/

i Want to send record on y -axies and in series data dynamically .
Attachments
issueresshift.JPG
issueresshift.JPG (64.68 KiB) Viewed 2615 times
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

it is possible to assign shift record to particular resource with drag and drop shifts on x-axies and y-axies
jedrzej.r
Posts: 712
Joined: Tue Jan 24, 2023 11:21 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

Hi!

I'm not sure if I understood correctly, but for adding and updating data dynamically, you could use dynamic methods provided within Highcharts, such as chart.addSeries, series.setData or series.addPoint.

Example: https://jsfiddle.net/BlackLabel/hs48ag6e/

References:
https://api.highcharts.com/class-refere ... #addSeries
https://api.highcharts.com/class-refere ... es#setData
https://api.highcharts.com/class-refere ... s#addPoint

​If you have further inquiries, you may reach out to me at any time.
Best regards!
Jędrzej Ruta
Highcharts Developer
kanti
Posts: 21
Joined: Fri Aug 18, 2023 7:18 am

Re: Display Current Day,Week,Month Data on Gantt chart By Clicking on Button

After getting new drop values how to save those new values back to salesforce




thanks

Return to “Highcharts Gantt”