image

Gantt Chart Hyper Library

DlhSoft's Gantt Chart Hyper Library includes a set of interactive scheduling components to use in your timeline enabled applications built with pure JavaScript, TypeScript, or a framework like Angular, React or Vue. – build

Run demos (150+) Download NuGet package Documentation

Free & unlimited support provided by developers  

Ready for the JavaScript framework of your choice

JavaScript
JavaScript/TypeScript
Documentation | Demos
Angular
Angular 8+
Tutorial | Demo
React
React.js
Tutorial | Demo
Angular
Vue.js/.ts
Tutorial | Demo

JavaScript based Gantt Charts

Customizable grid columns, summarized work breakdown structure, beautiful and interactive chart with draggable bars and dependency lines, copy-paste, filtering rows, detailed item change events. With full Typescript 2.0+ support.

Screenshot

Project management enabled

With optional auto-scheduling, critical item highlighting, resource leveling, baseline bars, and task splitting, these components were all built with full project management support in mind. Running on JavaScript, such as directly in your user's browser.

Screenshot

Customizable appearance, template function overrides

Change colors and miscellaneous style settings of the output HTML and SVG elements either generally or for individual data items, and write template overriding functions to generate custom interface for standard, milestone, and summary tasks, and/or for dependency lines, as needed. For example, to add support for bar interruptions as indicated below.

Screenshot

Printing, exporting images, Microsoft Project, and Excel®

Call Print method to initiate printing (or PDF exporting). Export HTML documents, and server side PNG images using GanttChartExporter component*. Enable saving and loading Microsoft Project XML content by leveraging ProjectSerlializer. Use Adapter API* to save and load data from Excel® sheets, too. | * Free for product licensees; requires .NET server.

Screenshot

Chart headers and schedules

Configurable timeline duration and zoom level, visible days and working hours, support for special days such as vacations (all possibly different for each item), scale headers with built-in or custom intervals and text, date formatters, and update interval applying upon dragging.

Screenshot

Grid cell editors, bar extras

Use either built in or custom grid cell template and conversion functions, including but not limited to date and date-time formatting and picking behaviors. The example below shows the assignment selector extra and a custom resource icon indicator for task bars in action.

Screenshot

Multiple bars/row (item parts)

Any item can either have a single bar to be shown on its row, or an array of "parts" indicating a set of bars to be presented instead. Each bar can be individually set up by the developer and dragged around by the user, having the same API as hierarchical item (excepting the grid cells.)

Screenshot

Schedule Charts

Based on project data you can also generate charts displaying items assigned to each resource on a separate row and allow dragging the bars vertically (from their bottom hoverable area) to change the assignments (or use custom code to allow dragging them between components.)

Screenshot

Hierarchical resources

Within a ScheduleChartView component, resources can be displayed in groups (of unlimited indentation levels) as well. With full expanding and collapsing support, of course. Again, everything on JavaScript alone.

Screenshot

Schedule (really) anything

And if you set up custom headers to display specific intervals, you can easily present anything that can be scheduled. Work shifts (night-morning-afternoon) presented below are just one example out of an infinity!

Screenshot

You can also easily generate other types of diagrams based on Gantt Chart items (or by defining data on the fly). JavaScript based, and with TypeScript definitions, too, of course.

Screenshot

Components

for HTML5 and JavaScript® with optional TypeScript support and Angular, React & Vue extensions • built with inline SVG support of HTML5
Background

Features

Customizable grid

Easily add built-in or custom grid columns bound to custom item fields, set up row filtering, and display built-in thumbs to allow end users to move items vertically in the hierarchical collection using drag and drop operations.

Customizable timeline

Customize working week and day time intervals, add nonworking days as needed, and use built-in and custom timeline scale types with built-in or custom header interval formatting and optional vertical bars.

Project management

Configure and manage tasks, dependencies, resources and assignments, and build highly compatible applications using Microsoft® Project XML schema based import and export. Print and export Gantt Chart documents.

Customizable appearance

Set up grid and chart item styles using CSS or define fully custom bar templates using custom code. Dependency lines can be also customized. Bootstrap friendly by design with built-in support for custom style class names.

High performance

User interface virtualization and asynchronous behaviors enabled by default and by design, getting the components responsive in less than 3 seconds when loading as much as 10,000 items on modern PCs.

Developer friendly

Test the product for free for unlimited time. Typescript definitions and AngularJS, Angular 8, React, and Vue extensions. Multiple sample applications are available, including a WebAPI access example with SQL Server® persistence.

Pricing

Multiple license types with different pricing options are available: there is one for everyone!

Mini Edition
Personal License
€{{ oldPrice1 }} €{{ price1 }} Order license
  • Gantt Chart component only
  • for a single developer
  • royalty-free perpetuum license
  • with unlimited support
Basic Edition
Small Team License
€{{ oldPrice2 }} €{{ price2 }} Order license
Standard Edition
Business Plus License
€{{ oldPrice3 }} €{{ price3 }} Order license
  • All components with source code
  • for any development team size
  • royalty-free perpetuum license
  • with unlimited high priority support
  • {{ testimonial.details }}

    Avatar
    {{ testimonial.author }}
    {{ testimonial.organization }}