We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

AutoScroll to DateTime.Now() and Highlight Today

Thread ID:

Created:

Updated:

Platform:

Replies:

118473 Mar 11,2015 10:33 AM UTC Mar 12,2015 12:37 PM UTC ASP.NET MVC 4
loading
Tags: Gantt
Alex Carlsen
Asked On March 11, 2015 10:33 AM UTC

2 things.
BackStory:
I generate quite a large gantt diagram - which in turn has a quite long scrollbar (horizontally)

First thing:
is there a way for me to scroll the diagram into position so I have "Today" in the center of my View
Second thing:
is there a way to highlight Today - like we can highlight weekends etc.

John Rajaram [Syncfusion]
Replied On March 12, 2015 09:00 AM UTC

Hi Alex,
Thanks for using Syncfusion products.

Query

Syncfusion Comments

First thing:
is there a way for me to scroll the diagram into position so I have "Today" in the center of my View

At present there is no support to set focus/view on specific taskbar item on loading or scroll down the Gantt chart to Today’s position. We have already logged this as Feature Request and a support incident has been created under your account to track the status of this requirement. Please log on to our support website to check for further updates.

https://www.syncfusion.com/account/login?ReturnUrl=/support/directtrac/incidents

But now we have achieved your requirement for auto scrolling the Gantt chart to today’s position while loading the Gantt control, through workaround with the help of “Create” client side event.

Please refer the below code snippets for more details.

Code Snippet:

<body style="position: static; margin: 0px; padding: 2px">

    @(Html.EJ().Gantt("Gantt").

    //...

    ClientSideEvents(eve =>

       {

           eve.Create("create");

       }).

    Datasource(ViewBag.dataSource)

    )

    @(Html.EJ().ScriptManager())

    <script type="text/javascript">

        function create(args) {

            var proxy = this, today, startDate, result,left;

                today = new Date();

                startDate = Globalize.parseDate(args.model.scheduleStartDate, this.model.dateFormat);

                result = Math.round((today - startDate) / (1000 * 60 * 60 * 24));

                left = result * 30;

            $("#ganttviewerbodyContianerejGanttChart" + this._id).ejScroller("option", "scrollLeft", left);

            $("#ganttviewerheaderContainerejGanttChart" + this._id).scrollLeft(left);

        }

    </script>

</body>

Second thing:
is there a way to highlight Today - like we can highlight weekends etc.

Yes, it is possible to highlight many number of days in the Gantt chart with the help of strip lines feature in Gantt control using the “Striplines” property.

Please refer the below code snippets for more details. Here we have highlighted the today’s date alone.

Code Snippet:

<body style="position: static; margin: 0px; padding: 2px">

    @(Html.EJ().Gantt("Gantt").

    //...

    StripLines(eve=>

       {

           eve.Label("Today").Day(DateTime.Now.ToString())

               .LineColor("Darkblue").LineStyle("dotted")

               .LineWidth(2).Add();

       }).

    Datasource(ViewBag.dataSource)

    )

    @(Html.EJ().ScriptManager())

</body>

We have also prepared a sample based on this. Please find the sample in the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/118473/MVCSample177414859.zip

Please let us know if you require further assistance on this.

Regards,
John. R



Alex Carlsen
Replied On March 12, 2015 09:19 AM UTC

Amazing Support as allways! you guys really do have the best support on the web

I have one issue though.

I've created a new StripLine, but the Diagram puts it as far to the right as it possibly can, although i've set the Day to be DateTime.Now.
 StripLines = new List<GanttStripLine>(){new GanttStripLine{Label = "Today", Day = DateTime.Now.ToString(),LineStyle = "Dotted", LineColor = "DarkBlue",LineWidth = 2}}

see attached screenshot

Alex Carlsen
Replied On March 12, 2015 09:25 AM UTC

And in the sample you sent me, the stripline is far to the left - which is fairly odd

John Rajaram [Syncfusion]
Replied On March 12, 2015 12:37 PM UTC

Hi Alex,
We have modified the previous workaround of the Gantt chart auto scrolling for viewing the today’s date in the center position of the Gantt chart. So that Stripline also can be rendered at the center position of the Gantt chart as per your expectation. 
Please refer the below code snippets for auto scrolling the Gantt chart based on the today’s date to the center position of Gantt chart. 

Code snippet:

<body style="position: static; margin: 0px; padding: 2px">

    @(Html.EJ().Gantt("Gantt").

    //...

 

    ClientSideEvents(eve =>

       {

           eve.Create("create");

       }).

    Datasource(ViewBag.dataSource)

    )

    @(Html.EJ().ScriptManager())

    <script type="text/javascript">

        function create(args) {

            var proxy = this, today, startDate, result,left;

                today = new Date();

                startDate = Globalize.parseDate(args.model.scheduleStartDate, this.model.dateFormat);

                result = Math.round((today - startDate) / (1000 * 60 * 60 * 24));

                left = (result-12) * 30;

            $("#ganttviewerbodyContianerejGanttChart" + this._id).ejScroller("option", "scrollLeft", left);

            $("#ganttviewerheaderContainerejGanttChart" + this._id).scrollLeft(left);

        }

    </script>

</body>

Please refer the below screen shot for more details.

 
 
  
  
  
  
  
  
  
  
  
  
  
  
 
 
 

 

We have also prepared a sample based on this. Please find the sample in the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/118473/MVCSampleUp1684242035.zip

If this is not your expectation, please share more information regarding your query. In the last update we did not receive your screen shot. So could you please share your images in compressed file with us, if the above solution does not meet your requirement and it will be very helpful for us to understand your requirement clearly?

Please let us know if you require further assistance on this.

Regards,
John R



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;