Deneb Examples - Enhanced Gantt Chart (alternate)

Deneb/Vega-Lite can be used to create a variety of enhanced Gantt Charts. The original example showed the actual schedule and included a Deneb/Vega-Lite toggle to show/hide the planned schedule.

The alternate example presented herein has many changes over the first, including:

  • table/matrix now uses both an alternating coloured background and all task columns are coloured [(actual + remaining) < planned = green; (actual + remaining) > planned = red]
  • 3 types of dependencies are shown with rule and point/triangle symbols: finish-to-start (FS), start-to-start (SS), and finish-to-finish (FF)
  • the “show planned” checkbox has been replaced with a “show dependencies” checkbox
  • the X-axis has been updated (conditional labels, positioning, colours, dash-patterns, and tick heights are used based on the first day of the month)

The alternate example also has a number of “under-the-hood” enhancements that, while they don’t directly affect the final outcome, improve the performance and maintainability of the visual. Some of the enhancements include:

  • encoding code duplication has been drastically reduced, with shared encoding used wherever possible
  • table/matrix uses a layered approach with a hidden “bar” mark (to permit the alternating colour background) instead of seven horizontally concatenated visuals
  • the project performance metrics box has been right-aligned to the Gantt chart

The simple dataset contains planned and actual start and end dates, planned, actual, and remaining days, and task work breakdown structure (WBS) and successor WBS. Power BI is leveraged to create simple calculated columns for estimated start and end dates and days late. All phase calculations are done in Vega-Lite.

NOTE:
This alternate example contains the “planned” transforms used in the original example; as the goal was to add dependencies, many existing transforms are legacy (and unused) and were not removed.

This example illustrates a number of Deneb/Vega-Lite features, including:
0 - General:

  • a “title” block with subtitle
  • a shared “transform” block to extend the dataset in-visual with:
    • 3x “calculate” transforms to determine if the task is a milestone and to parse the WBS to determine the phase
    • a series of 18 “calculate” and “joinaggregate” transforms to determine the phase planned and actual start dates, end dates, and duration (days)
    • 2x “calculate” transforms to determine the variance duration (days) and percent
    • 2x “calculate” transforms to determine the phase and task estimated progress dates
    • 3x “calculate” transforms to determine the phase, task, and milestone completion percentages
    • a “calculate” transform to determine the value of today’s date
  • a “params” block with:
    • a checkbox to interactively get the user choice to display or hide the dependencies in the Gantt Chart
  • an “hconcat” block to display the table and Gantt Chart side-by-side

1 - Table:

  • a nested “layer” block to display the bar background, the column heaers, and seven columns side-by-side (WBS, Phase/Task, start date, PL and AC durations, variance duration and percent):
    • all columns use conditional formatting to display:
      • phases in larger font bold black
      • tasks with negative variances in bold and the “negative” sentiment colour of the current Power BI theme
      • tasks with non-negative variances in standard font (black and normal weight)

2 - Gantt:

  • a “layer” block with sections for the FS, FF and SS dependecies, the today gridline, the actual bars, and the project metrics
  • a shared “encoding” block for the x-axis to ensure it is applied to all layers with:
    • “temporal” type
    • a hard-coded scale from February 1 to July 1
    • conditional labels for the month and date (a 2-element array with month shown only for the first of the month)
    • conditional position based on the date of the month (first and others)
    • conditional tick size based on the date of the month (first and others)
    • conditional gridline colour based on the date of the month (first and others)
    • conditional gridline dash pattern based on the date of the month (first and others)
    • conditional tick mark colour based on the date of the month (first and others)
    • conditional tick mark dash pattern based on the date of the month (first and others)
    • a tick count of 4 (Vega-Lite automatically sets labels every second tick mark to improve the legibility)
  • a shared “transform” block to extend the dataset in-visual with:
    • 3x “lookup” transforms to perform a self-lookup of successor data values (actual start, actual end, and is milestone)
    • 4x “calculate” transforms to determine the before and after offsets of the actual start and end dates

3 - FS Dependencies:

  • a nested “transform” block with:
    • a “filter” transform to reduce the dataset to records with dependency type = FS
  • a shared “encoding” block to ensure the same Y-axis is applied to all layers
  • a nested “layer” block with:
    • a “rule” mark for the vertical dependency lines
    • a “rule” mark for the horizontal dependency lines
    • a “point/triangle-right” mark for the dependency arrowhead

4 - FF Dependencies:

  • a nested “transform” block with:
    • a “filter” transform to reduce the dataset to records with dependency type = FF
  • a shared “encoding” block to ensure the same Y-axis is applied to all layers
  • a nested “layer” block with:
    • a “rule” mark for the horizontal dependency lines (LTR)
    • a “rule” mark for the vertical dependency lines
    • a “rule” mark for the horizontal dependency lines (RTL)
    • a “point/triangle-left” mark for the dependency arrowhead

5 - SS Dependencies:

  • a nested “transform” block with:
    • a “filter” transform to reduce the dataset to records with dependency type = SS
  • a shared “encoding” block to ensure the same Y-axis is applied to all layers
  • a nested “layer” block with:
    • a “rule” mark for the horizontal dependency lines (RTL)
    • a “rule” mark for the vertical dependency lines
    • a “rule” mark for the horizontal dependency lines (LTR)
    • a “point/triangle-right” mark for the dependency arrowhead

6 - Today:

  • a nested “transform” block with:
    • a “filter” transform to reduce the dataset to a single row
    • a “calculate” transform to determine the formatted value for today’s date
  • a nested “layer” block with:
    • a “rule” mark to display a dashed vertical gridline at the “today” value using the “negative” sentiment colour of the current Power BI theme
    • a “text” mark to display the “today” label at the bottom of the gridline, again using the “negative” sentiment colour of the current Power BI theme

7 - Actual:

  • a shared “encoding” block to ensure the same Y-axis is applied to all layers
  • a nested “layer” block with:
    • 2x thick “tick” marks for the phase actual (or estimated) start date and end date symbols (whiskers)
    • a 40% height “bar” mark for the actual (or estimated) phase using the (50% darker) first colour of the current Power BI theme
    • a 40% height “bar” mark for the actual (or estimated) progress of the phase in black
    • a 70% height “bar” mark for the actual (or estimated) task using the (25% darker) first colour of the current Power BI theme
    • a 20% height “bar” mark for the actual (or estimated) progress of the task in black
    • a “square” mark rotated by 45 degrees for the actual (or estimated) milestones using the (50% darker) first colour of the current Power BI theme
      • uses a black fill when the milestone is complete
    • 3x “text” marks for the phase, task, and milestone percent completion labels
      • phase % labels are hidden (made transparent) if the phase has not started
      • task % labels are hidden (made transparent) if the task has not started
      • milestone % labels are hidden (made transparent) if the milestone has not been reached

8 - Project Metrics:

  • a nested “transform” block with:
    • a series of 6 “calculate” and “joinaggregate” transforms to determine the project planned and actual start dates, end dates, and duration (days)
    • 2x “calculate” transforms to determine the project variance duration (days) and percent
    • a “calculate” transform to determine the overall project schedule status (ahead, behind, or on)
    • a “filter” transform to reduce the dataset to a 4 rows
    • 3x “calculate” transforms to set values for the metric y coordinate offset, metric label, and metric value
  • a nested “layer” block with:
    • a “rect” mark with hard-coded range coordinates to create a background box for the metrics
      • the box border is coloured according to the project schedule status (ahead=the “positive” sentiment colour of the current Power BI theme, or behind=the “negative” sentiment colour of the current Power BI theme, on=black)
    • 3x “text” marks for the title, metric label, and metric value

The intent of this example is not to provide a finished visual, but rather to serve as a starting point for further development.

Also included is the development PBIX using an alternate version of the made-up data.

This example is provided as-is for information purposes only, and its use is solely at the discretion of the end user; no responsibility is assumed by the author.

Greg
Deneb Examples - Enhanced Gantt Chart (alternate).pbix (1.5 MB)

1 Like

marking as solved