Skip to main content

​
Static vs. Dynamic Coloring

The Gantt supports two coloring modes that determine how task bar colors are applied: diagram Dynamic coloring (default): Task bars display progress-based colors (overdue, progress-due, resolved) that override the default color. Use task.taskColor in the Item Script to change the base color while keeping progress color overrides active. Static coloring: Set gantt.config.show_progress_colors=false in the Gantt Config Script to disable progress-based color overrides. Use task.color in the Item Script to set the final task bar color directly.
In dynamic mode, task.taskColor changes only the default (blue) base color — progress-related colors still override it for overdue or resolved tasks. In static mode, task.color sets the absolute color with no overrides. Mixing them incorrectly produces unexpected results.

​
Progress Color Properties

These administration properties control the colors applied to task bars based on their scheduling status when dynamic coloring is active:
NameTypeDefaultDescription
nextedy.gantt.default.progress_color_overdueStringredColor applied to task bars where the end date is in the past (task is overdue).
nextedy.gantt.default.progress_color_progressdueStringorangeColor applied to task bars where the progress date is in the past (progress is behind schedule).
nextedy.gantt.default.progress_color_resolvedStringgrayColor applied to task bars that are in a resolved status.
Set these properties in Administration > Configuration Properties to apply globally: 
nextedy.gantt.default.progress_color_overdue=red
nextedy.gantt.default.progress_color_progressdue=orange
nextedy.gantt.default.progress_color_resolved=gray
Alternatively, set them per Gantt instance in the Gantt Config Script: 
gantt.config.progress_color_overdue = "#e53935";
gantt.config.progress_color_progressdue = "#fb8c00";
gantt.config.progress_color_resolved = "#0AA33A";

​
Unplanned Item Colors

NameTypeDefaultDescription
nextedy.gantt.workitems.unplanned_colorString#7D3C98Background color of unplanned task bars (items without a start date).
nextedy.gantt.workitems.unplanned_color_fgStringSee applicationForeground (text) color of unplanned task bars.

​
Today Marker Color

NameTypeDefaultDescription
nextedy.gantt.today.colorStringgrayColor of the vertical “today” marker line on the Gantt chart.

​
Resource Marker Colors

The resource view uses color-coded markers to indicate resource allocation levels. The resourceMarkersColorConfig object defines the color scheme:
PropertyTypeDefaultDescription
ok colorString#4CAF50 (green)Color for resource markers within capacity. Applied via the marker_ok CSS class.
over colorStringRed/orange gradientColor for resource markers that exceed capacity. Applied via the marker_over CSS class.
percentagesArray of numbersSee applicationAscending threshold values defining breakpoints for marker color changes.
colorsArray of stringsSee applicationColor values for each allocation level. Must be one element longer than the percentages array.
The colors array must have exactly one more element than the percentages array. The percentages array must contain numeric values in ascending order. Invalid configurations produce error messages in both view mode and the wiki editor.

​
Marker CSS Classes

The Gantt applies CSS classes to timeline markers based on their type:
CSS ClassApplied ToDescription
todayToday markerThe vertical line marking today’s date on the timeline.
planPlan markersMarkers synced from plan (iteration) boundaries.
marker_okResource markersResource allocation cells within capacity.
marker_overResource markersResource allocation cells exceeding capacity.
Custom markers defined without a specific color class receive the base marker styling. You can assign a named CSS color class (e.g., blue) to custom markers to override the default appearance.

​
Disabling Dynamic Coloring

To use purely static colors without progress-based overrides, add the following to the Gantt Config Script: 
gantt.config.show_progress_colors = false;
Then use task.color in the Item Script to set colors based on your custom logic: 
if (wi.getType().getId() === "workpackage" && wi.getStatus().getId() === "draft") {
    task.color = "#bfbfbf";
}

​
CSS-Based Styling

You can apply custom CSS styles to Gantt elements through the Parameters Script section. For example, to change the font color of task labels: 
<style>
.gantt_task_content {
    color: #333333;
}
</style>
CSS class names and DOM structure may vary between Gantt versions. Verify the available CSS classes in your specific version. See CSS Classes and DOM Structure for a reference.

​
Configuration Example

To set up custom progress colors and disable dynamic coloring for a specific Gantt:
  1. In Administration > Configuration Properties, add: 
    nextedy.gantt.default.progress_color_overdue=#e53935
nextedy.gantt.default.progress_color_resolved=#43a047
nextedy.gantt.workitems.unplanned_color=#c7cffb
nextedy.gantt.workitems.unplanned_color_fg=#001379
  2. For a specific Gantt page that needs static coloring, add to the Gantt Config Script: 
    gantt.config.show_progress_colors = false;
  3. In the Item Script, define the color logic: 
    if (wi.getType().getId() === "feature") {
    task.color = "#42a5f5";
}
KB ArticlesSupport TicketsSource Code
  • prod-gantt-src/com.nextedy.polarion.gantt.client/cypress/e2e/Aresource-view/ganttMarkersColorConfigValidation.cy.ts
  • prod-gantt-src/com.nextedy.polarion.gantt.client/src/js/config.js
  • prod-gantt-src/com.nextedy.polarion.gantt.client/src/js/default.json
  • prod-gantt-src/com.nextedy.polarion.gantt.client/cypress/e2e/view/resourceAllocation.cy.ts
  • prod-gantt-src/com.nextedy.polarion.gantt.client/cypress/e2e/view/markersStyles.cy.ts