frappe-gantt-light-version
Reactive icon

Frappe Gantt - Light Version

Stable version 1.0.6 (Compatible with OutSystems 11)
Uploaded
 on 4 Mar
 by 
5.0
 (1 rating)
frappe-gantt-light-version

Frappe Gantt - Light Version

Documentation
1.0.6

Refer to these page on setup the chart for:

  • DemoLevelOfComplete: different color for each progress status
  • DemoFixedHeader: fix the header always on top


Add this css for the complete grid row's color: .gantt .bar-complete-x {}

Add this css for the progress color of grid row: .gantt .bar-progress-x {}


1.0.5

The bugs fixed:

  • ScrollToToday
  • ScrollToDate


Refer to these page on setup the chart for:

  • DemoCrossDependency: multiple projects in 1 gantt chart separate by the white grid row
  • DemoShowDependencyMessage: the action along with message to show how many cross dependencies.


Add this css for the white grid row: .gantt .grid-row.grid-row-white { fill: #ffffff; }

Add this css for the cross dependency message: 

.gantt .bar-wrapper .bar-group .bar-label.bar-label-extra.bar-label-left { fill: var(--color-neutral-9);}


1.0.4

Function to scroll to the task (client Action "ScrollToAction"): call this function to focus on the action

  1. In_Id : is the id of the task bar to focus on
  2. In_ParentCss : is the css of the parent div of svg

The bug fixed: error message "Page size must be smaller than 14400 by 14400" will be raised up when the size of the exported image exceeds.

Add the below css to set the different color for the completed milestone

.gantt .bar-milestone.completed{

  fill: var(--color-primary);

}


1.0.3

Clear active clicked bar (client action "ClearActiveBar"): call this function can clear the clicked bar on chart

Export JPEG (client action "ExportJPEG"): for update, this function requires 2 more inputs: 

  1. In_ParentCss: is the css of the parent to export to JPEG
  2. In_IsToBase64: to auto save a file or just create an a tag with the base64 url 

Anchor left for view mode month and year: need to declare the below css in your theme

.gantt .bar-label.bar-label-left {

  text-anchor: start;

}



1.0.2

Scroll to date (client action "ScrollToDate"): call this function can focus the input date on chart

Clear highlight search result (client action "ClearHighlightSearchResult"): call this function can clear all the highlight items on chart

Highlight search result (client action "HighlightSearchResult"): call this function can highlight the input id of the bar (need to add css for ".gantt .bar-search-result"

For snapshot with status:

  • Define css for ".gantt .bar-ontime" and ".gantt .bar-late"
  • Turn on the HasSnapshot to true
  • IsOntime to be set true/false


Note: view the DemoSnapshot screen for more detail about the snapshot function


1.0.1

Scroll to today (client action "ScrollToToday"): call this function can focus the today part on chart

Export to jpeg (client action "ExportJPEG"): call this function can export FULL chart to jpeg, although the chart has scroll or not

Snapshot function: there some note for data of snapshot:

  1. both snapshot and main items are in the same list
  2. the snapshot item should be set: IsSnapshot = true
  3. the snapshot item should come right before the main related item
  4. the following items should count all the previous snapshot items and assign to NoOfPrevSnapshot

Note: view the DemoSnapshot screen for more detail about the snapshot function


1.0.0

Need to follow these steps to make the Gantt chart work for your screen 

  1. Use the GanttChart block to add to the screen
  2. If there is a viewmode, use the client action ChangeViewMode
  3. Need to refer frappegantt and ganttsample in the screen
  4. Need to add the css for gantt components

The view mode includes:

  • Day
  • Week
  • Month
  • Year