function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Wes McCarthyWes McCarthy 

VF Page for Gantt Chart display

Hi there,

Im trying to use some VF code to display a gantt chart in SF, but am having problems getting it to display.  Im using code provided from http://dhtmlx.com/docs/products/dhtmlxGantt/.  My VF page is saving ok, but it doesnt display anything when rendered.
The full code is outlined below.

Any help is much appreciated!  Thanks.


<apex:page standardController="Order" standardStylesheets="false" showHeader="false">

    <style>
        body {font-size:12px; background: #F3F3EC; padding-top: 0px;}
        .{font-family:arial;font-size:12px}
        h1 {cursor:hand;font-size:16px;margin-left:10px;line-height:10px}
        xmp {color:green;font-size:12px;margin:0px;font-family:courier;background-color:#e6e6fa;padding:2px}
        .hdr{
            background-color:lightgrey;
            margin-bottom:10px;
            padding-left:10px;
        }
    </style>


    <head>
    <apex:stylesheet value="{!URLFOR($Resource.Gantt, 'codebase/dhtmlxgantt.css')}"/>

    <apex:includeScript value="{!URLFOR($Resource.Gantt, 'codebase/dhtmlxcommon.js')}"/>
    <apex:includeScript value="{!URLFOR($Resource.Gantt, 'codebase/dhtmlxgantt.js')}"/>

    <script language="JavaScript" type="text/javascript">
        function createChartControl(htmlDiv1)
        {
            //project 1
            var project1 = new GanttProjectInfo(1, "Institutional Sales", new Date(2010, 5, 11));
    
            var parentTask1 = new GanttTaskInfo(1, "IS Planning Timeline", new Date(2010, 5, 11), 208, 100, "");
            parentTask1.addChildTask(new GanttTaskInfo(2, "Plan Development", new Date(2010, 5, 11), 100, 100, ""));
            parentTask1.addChildTask(new GanttTaskInfo(3, "Finalize Your Plan", new Date(2010, 5, 21), 24, 100, ""));
            parentTask1.addChildTask(new GanttTaskInfo(4, "Manager Discussions", new Date(2010, 5, 24), 80, 100, ""));
            parentTask1.addChildTask(new GanttTaskInfo(4, "Final Revisions", new Date(2010, 6, 4), 24, 100, ""));
            
            project1.addTask(parentTask1);

    
            var ganttChartControl = new GanttChart();
            ganttChartControl.setImagePath("{!URLFOR($Resource.Gantt, 'codebase/imgs/')}");
            
            ganttChartControl.setEditable(false);
            
            ganttChartControl.addProject(project1);
            
            ganttChartControl.showTooltip(false);
            ganttChartControl.create(htmlDiv1);
        }
        
        
    </script>
    

    </head>

    <body onload="createChartControl('GanttDiv')">
        <div style="width:100%;height:240px;position:absolute;" id="GanttDiv"></div>
    </body>



</apex:page>