Milestones - Profitbase/PowerBI-visuals-Gantt GitHub Wiki

Milestones are used to highlight key dates or project deadlines on your Gantt chart. They appear as distinct shapes directly on the corresponding task rows on your timeline.


How to Configure Milestones

Step 1: Set up your milestone data structure

To support milestones per task row, structure your dataset with separate date columns representing each milestone (for example, "Gate 1 Date" and "Gate 2 Date").

Dataset structure showing multiple milestone date columns

Step 2: Add date fields to the Milestones bucket

Drag the date fields you want to use from your dataset into the Milestones data bucket in the Build visual pane.

Milestones displayed on task rows

By dragging multiple date fields into the Milestones bucket, you can show several milestones on the same task row.

Adding multiple date fields to the Milestones bucket

Multiple milestones displayed on a single task row

Step 3: Add labels to the Milestone Details bucket

To display text labels next to your milestone shapes, drag a text field into the Milestone Details data bucket in the Build visual pane.

[!IMPORTANT] Milestone shapes will only display text labels on the timeline if a corresponding text field is added to the Milestone Details bucket. If this bucket is left empty, enabling the "Show Label" toggle in the Format pane will not display any text.


How to Style Milestones

1. Style Individual Milestone Fields

If you have added multiple milestone date fields to your visual (for example, Milestone and Milestone 2), the Milestone settings card in the Format pane will display separate, expandable sub-cards for each milestone field. This allows you to customize the styling of each milestone field independently.

Milestone card showing separate sub-cards for each milestone field

2. Milestone Styling Options

Expand an individual milestone's sub-card to access its design controls:

Expanded milestone sub-card settings in the Format pane

Customize the milestone styling using the following settings:

  • Show Label: Toggle to display or hide the text label next to the milestone shape on the timeline. Note: Text labels will only render if you have mapped a field in the Milestone Details data bucket.
  • Label type: Choose how the milestone details are shown:
    • Label: Displays the text permanently as a static text label directly next to the milestone shape on the timeline.
    • Tooltip: Displays the text only inside the interactive popup window when a user hovers over the milestone shape, keeping the timeline clean.
  • Label position: Choose where the label is positioned relative to the shape (such as Right, Left, Top, or Bottom).
  • Label Text Size: Set the font size of the milestone label text.
  • Label Color: Select the color for the label text.
  • Type: Choose the marker shape for this milestone. Supported shapes are:
    • Diamond
    • Square
    • Circle
    • Triangle Left
    • Triangle Right
    • Plus
    • Minus
    • Cross
    • Trapezoid
    • Pentagon
    • Arrow Right
    • Arrow Left
    • Star
    • Star8
    • Gear
  • Size: Adjust the display size of the milestone shape on the timeline.
  • Top Offset: Shift the vertical position of the milestone shape up or down to align it perfectly with your taskbar.
  • Background Color: Select the fill color of the milestone shape.
  • Background Label Color: Select the background fill color behind the label text.
  • Border Color: Choose the outline color around the milestone shape.
  • Border Width: Adjust the thickness of the milestone shape's outline border.