Overview

Gantt Chart Pro is an enterprise-grade, highly customizable advanced production scheduling and tracking timeline visualization widget designed specifically for Mendix applications.

It provides a complete, modern timeline experience with support for hierarchies, baselines, milestones, dependencies, tooltips, progress tracking, and more all rendered with smooth, high-performance interactions.

Whether you're building:

• Production planning dashboards
• Manufacturing or batch scheduling
• Resource allotment tools
• Project timelines
• Logistics or maintenance planning views

Gantt Chart Pro brings a powerful interactive timeline engine directly into your Mendix UI.

This widget is free in all local development and Sandbox environments and requires a production license for deployed apps.

⭐ Key Features

• Multiple timeline modes: Hour, Day, Week, Month, Auto
• Smooth zooming (50–300%)
• Parent/child hierarchy with expand & collapse
• Baseline vs Actual comparisons
• Milestone rendering
• Dependency connectors & arrows
• Progress indicators (0–100%)
• Sticky metadata & date headers
• Weekend shading
• Today marker
• Hover tooltips & child rollup insights
• Highly optimized rendering for large production datasets
• JSON-driven configuration
• Optional Row Click and Row Double Click microflow actions
• Built entirely in React (no external libraries)

🧪 How It Works (In Practice)

1. Build JSON Data

Use a microflow to fetch your tasks, compute any derived values, and export them to JSON.

2. Bind JSON to the Widget

Set jsonExpression ➝ String attribute returned by the microflow.

3. Configure Interaction (Optional)

Use onRowClick or onRowDoubleClick to open pages or run workflows.

4. Deploy

Local dev & Sandbox = Free

Test/ACC/Production = Trial or Licensed

🔐 Licensing Overview

Included in widget:

• 30-day trial on first deployment
• Trial banner during evaluation
• Automatic bypass for local/Sandbox environments
• Per-app license key activation

Contact DIGIVISORY for licensing:

📧 helpdesk@digivisory.co.za

🌐 www.digivisory.co.za

Documentation

📘 Gantt Chart Pro — Usage Documentation

1. Introduction

Gantt Chart Pro is an advanced timeline and scheduling widget for Mendix applications.

It renders hierarchical tasks, milestones, baselines, dependencies, and progress bars in an interactive, scrollable Gantt chart.

The widget supports:

• Task hierarchies (unlimited depth)
• Expand/collapse
• Progress values
• Milestones
• Baseline vs. actual date ranges
• Dependencies (connectors)
• Month / Week / Day / Hour views
• Zoom and scroll synchronization
• “Scroll to Today” functionality
• 30-day trial mode and license validation

This documentation explains how to configure and use the widget in your Mendix app.

📥 2. Installation

1. Open your Mendix app in Studio Pro.
2. Open the App Store, search for Gantt Chart Pro.
3. Click Download, then Import into Project.
4. Drag the GanttChart widget onto any page.

🧱 3. Data Input (JSON Format)

The widget consumes a JSON expression representing your tasks.

⚠ Important

Data must be converted to JSON before feeding it to the widget.

Most users create:

• A non-persistent entity,
• A microflow, or
• A JavaScript action

that transforms Mendix objects into JSON.

3.1 JSON Structure

[

{

"id": "",

"name": "",

"shortName": "",

"parent": "",

"baselineStart": ,

"baselineEnd": ,

"actualStart": ,

"actualEnd": ,

"progressValue": "",

"milestone": ,

"customClass": "",

"barColor": "",

"connector": [

{

"connectTo": "",

"connectorType": ""

}

]

}

]

Required fields

Optional fields

⚙️ 4. Widget Properties

Below is a description of the widget’s configuration options.

4.1 JSON Expression

Required

A string representing the task collection in JSON format.

4.2 View Mode

Controls the timeline scale:

• Month
• Week
• Day
• Hour
• Auto (recommended)

Auto mode intelligently chooses the best view mode based on task date range.

4.3 Chart Title

A title displayed above the toolbar.

4.4 Chart Height

Widget height in pixels.

Default: 480

4.5 Collapse All on Load

When enabled:

• All parent tasks start collapsed
• Child tasks are hidden until expanded

4.6 Show Dependency Connections

When enabled, connector arrows are drawn between tasks.

Default: true

4.7 Show Today Marker

Displays a red vertical line showing the current date/time.

Default: true

4.8 Events

On Row Click (optional)

Executes a microflow/NF when a user clicks a task row.

Input parameters:

• ItemId (string)
• ItemName (string)

On Row Double Click (optional)

Same structure as above.

🔐 5. Licensing (Trial + Production Mode)

5.1 When is a license required?

A 30-day trial automatically activates on first deployment.

5.2 LicenseKey

Paste your production license key here.

If valid:

• Trial banner disappears
• Full features unlock

🧭 6. How to Generate JSON Data in Mendix

Most Mendix apps create JSON using a microflow and “Export Mapping to JSON” action.

Typical steps:

1. Retrieve or compute tasks
2. Convert each to a non-persistent “TaskDTO”
3. Map TaskDTO list to JSON string
4. Bind JSON to the widget

Example DTO Entity

Microflow Outline

Retrieve Tasks → For each: Create TaskDTO Map DateTimes → milliseconds Collect DTOs → Export to JSON string → Return to widget → jsonExpression

🧪 7. Advanced Features

7.1 Parent Segmented Summary Bars

When a parent task is collapsed:

• Children are summarized into colored timeline segments
• Hovering shows child task details

7.2 Weekend Highlighting

Automatic shading for weekend days in Day/Week/Hour modes.

7.3 Sticky Headers & Columns

• Date header stays visible during scroll
• Metadata columns (Task/Start/End/Progress) remain fixed

7.4 Automatic Scroll-to-Today

On load or after view mode:

• Timeline scrolls horizontally to center today’s date

7.5 Hourly Mode

Perfect for high-resolution scheduling (manufacturing shifts, operations).

🧰 8. Troubleshooting

Widget shows “No tasks available.”

• JSON may be invalid
• JSONExpression might be empty
• Conversion microflow did not execute

Connectors do not display

• Check that target IDs exist
• Ensure tasks are visible (collapsed parents hide children)

Trial expired message appears

• Provide a valid license key
• Or reset trialDays only in development environments

Gantt does not scroll to today

Some Mendix layouts restrict scroll areas — ensure container is flexible or scrollable.

🏁 9. Support & Contact

For licenses, feature requests, or help:

📧 helpdesk@digivisory.co.za

🌐 www.digivisory.co.za

DIGIVISORY provides:

• Standard support
• Dedicated feature development
• Enterprise licensing
• Integration assistance