function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
KeithJKeithJ 

2 Dates - how to log on a timeline

Hey there.

I'm trying to determine the best approach to something I'm about to build.

I'm looking to develop out some sort of Gantt chart -  What concerns me the most

is how to plot a start date and an end date against a set calendar (logically).

I could build out the calendar part fine - but any suggestions as to how I could

plot a coloured bar against a date from the start time to the end time:

 

Similar to the standard salesforce calendar:

 

 

I could create the calendar ok - but any suggestions for plotting a coloured bar based on a start date and end date?

Is there some sort of standard approach people adopt to this? This doesn't seem easy...

 

Thanks & Best regards

KeithJKeithJ

If Im using a table with a td

would i dynamically be able to set the td

//Something like <td> <div style="width: {!val}; color: #FF;" /> </td>

 

width based on a visualforce controller property?
Thanks!

 

Rajesh ShahRajesh Shah
It should work. For our case, we were displayong the color of the td depending on the data and we used merged field in a similar way and it worked.
KeithJKeithJ

Excellent - thank you Rajesh.

Can you post an example if possible?
Thanks

Rajesh ShahRajesh Shah

We defined 3 style classes as shown below in the VF page:

 

.colourred{ background-color: #e1a5aa; } .colourgreen{ background-color: #8cb473; } .colourwhite{ background-color: transparent; }

 

 Then in the controller, based on the data, we would decide the color required and set the class name as shown below:

 

<td align="center" width="10%" class="{!Refvar.classname}" ... > </td>

 

 

 

KeithJKeithJ

Thanks Rajesh - that helps :)

What about setting the width of the coloured div?

Thanks again,

Rajesh ShahRajesh Shah
Though I didn't tried setting the width using the controller, I guess it should work. If it doesn't, you can define the width in your class style sheet (if possible) and use that.
KeithJKeithJ

Sounds good!

Thank you very much