4

I have created a webpart with a JS Grid control with gantt enabled. I want the gantt view to display months instead of weekdays. Anyone have an idea how to do this?

Update: The following link is what I used to create the gantt webpart. http://msdn.microsoft.com/en-us/library/ff407962.aspx What I need is to zoom out gantt.

I have found SetZoomLevelInternal and SetZoomLevel in JsGrid.Gantt.js but cant see how to get it working.

3

2 Answers 2

4

Combining SharePoint 2010 – Autozoom Gantt Chart Web Part with my own code, i get this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script><script type="text/javascript">
// By Cees Timmerman, 24oct12.
$(function(){
  setTimeout(function(){
    $("th[title='Title']").css({"width":"400px"})
    for (var i = 0; i < 3; ++i) WebPartWPQ2_JSGridController.ZoomOutGantt()
  }, 2000)
})</script>

Put that in a Content Editor's HTML source and enjoy.

If you want to get all fancy, try this:

ExecuteOrDelayUntilScriptLoaded(function(){
  var oldGanttControl = SP.GanttControl
  SP.GanttControl = function(){
    oldGanttControl.call(this)
    var oldInit = this.Init
    this.Init = function(jsGridControl, jsRawGridData, params){
      oldInit.call(this, jsGridControl, jsRawGridData, params)
      DoCustomizations(jsGridControl)
    }
  }
}, "SPGantt.js")
function DoCustomizations(grid){
  grid.SetSplitterPosition(800)
  grid.SetGanttZoomLevel(grid.GetGanttZoomLevel()-1)
  var columns = grid.GetColumns()
  $.each(columns, function(key, value){value.width=200})
  grid.UpdateColumns(grid.parentNode.jsgridtableviewparams.columns)
}
2
  • Will the 1st script work with OOB Gantt Chart view?
    – George
    Sep 8, 2015 at 9:10
  • If you can correct the zoomOut function, it will work with the default Gantt chart. Sep 9, 2015 at 13:41
0

for displaying months in gantt view. I did little modifications to fancy thing above.

<script type="text/javascript">
ExecuteOrDelayUntilScriptLoaded(function(){
  var oldGanttControl = SP.GanttControl
  SP.GanttControl = function(){
    oldGanttControl.call(this)
    var oldInit = this.Init
    this.Init = function(jsGridControl, jsRawGridData, params){
      oldInit.call(this, jsGridControl, jsRawGridData, params)
      DoCustomizations()
    }
  }
}, "SPGantt.js")
function DoCustomizations(){
    WebPartWPQ2_JSGridController.ZoomOutGantt();
    WebPartWPQ2_JSGridController.ZoomOutGantt();
}</script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.