Description
DHTMLX Gantt is an open-source JS Gantt chart that enables you to show the schedule of a project in a neat chart.
DHTMLX Gantt provides a flexible API and a large number of event handlers to create a comprehensive Gantt chart application.
DHTMLX Gantt can show the dependencies between tasks as lines and allows you to set up different relationships between tasks (finish-to-start, start-to-start, finish-to-finish, start-to-finish).
DHTMLX Gantt alternatives and similar libraries
Based on the "d3" category.
Alternatively, view DHTMLX Gantt alternatives based on common mentions on social networks and blogs.
-
echarts
Apache ECharts is a powerful, interactive charting and data visualization library for browser -
fabric.js
Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser -
BabylonJS
Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework. -
p5.js
p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing. http://twitter.com/p5xjs — -
paper.js
The Swiss Army Knife of Vector Graphics Scripting – Scriptographer ported to JavaScript and the browser, using HTML5 Canvas. Created by @lehni & @puckey -
Frappe Charts
Simple, responsive, modern SVG Charts with zero dependencies -
sigma.js
A JavaScript library aimed at visualizing graphs of thousands of nodes and edges -
dc.js
Multi-Dimensional charting built to work natively with crossfilter rendered with d3.js -
mxGraph
Diagramming library that enables interactive graph and charting applications to be quickly created that run natively in any major browser that is supported by its vendor. -
two.js
A renderer agnostic two-dimensional drawing api for the web. -
heatmap.js
🔥 JavaScript Library for HTML5 canvas based heatmaps -
rickshaw
JavaScript toolkit for creating interactive real-time graphs -
metrics-graphics
A library optimized for concise and principled data graphics and layouts. -
cubism
Cubism.js: A JavaScript library for time series visualization. -
processing.js
Processing.js makes your data visualizations work using web standards and without any plug-ins -
react-simple-maps
Beautiful React SVG maps with d3-geo and topojson using a declarative api. -
d3plus
A javascript library that extends D3.js to enable fast and beautiful visualizations. -
Bezier.js
A nodejs and client-side library for (cubic) Bezier curve work -
jquery.sparkline
A plugin for the jQuery javascript library to generate small sparkline charts directly in the browser -
Ember Charts
[Moved to: https://github.com/Addepar/ember-charts] -
uvCharts
Simple yet powerful JavaScript Charting library built using d3.js -
pykcharts.js
Well designed d3.js charting without the complexity of d3.js. -
dhtmlxSuite v.7.3.0 Standard edition
GPL version of DHTMLX Suite -
COVID-19 in Charts
Visual representations of the progression of COVID-19.
Appwrite - The open-source backend cloud platform
* Code Quality Rankings and insights are calculated and provided by Lumnify.
They vary from L1 to L5 with "L5" being the highest.
Do you think we are missing an alternative of DHTMLX Gantt or a related project?
README
dhtmlxGantt
Getting started | Features | Follow us | License | Useful links
dhtmlxGantt is an open source JavaScript Gantt chart that helps you illustrate a project schedule in a nice-looking chart.
It can show the dependencies between tasks as lines and allows you to set up different relationships between tasks (finish-to-start, start-to-start, finish-to-finish, start-to-finish).
dhtmlxGantt provides a flexible API and a large number of event handlers, which gives you the freedom to customize it for your needs.
Getting started
Add files:
<script src="dhtmlxgantt.js" ></script>
<link rel="stylesheet" href="dhtmlxgantt.css" type="text/css">
Add markup:
<div id="gantt_here" style='width:100%; height:100vh;'></div>
And initialize:
gantt.config.date_format = "%Y-%m-%d %H:%i";
gantt.init("gantt_here");
gantt.parse({
data: [
{id: 1, text: "Project #1", start_date: null, duration: null, parent:0, progress: 0, open: true},
{id: 2, text: "Task #1", start_date: "2019-08-01 00:00", duration:5, parent:1, progress: 1},
{id: 3, text: "Task #2", start_date: "2019-08-06 00:00", duration:2, parent:1, progress: 0.5},
{id: 4, text: "Task #3", start_date: null, duration: null, parent:1, progress: 0.8, open: true},
{id: 5, text: "Task #3.1", start_date: "2019-08-09 00:00", duration:2, parent:4, progress: 0.2},
{id: 6, text: "Task #3.2", start_date: "2019-08-11 00:00", duration:1, parent:4, progress: 0}
],
links:[
{id:1, source:2, target:3, type:"0"},
{id:2, source:3, target:4, type:"0"},
{id:3, source:5, target:6, type:"0"}
]
});
Complete guides
- Vue.js
- Angular
- React
- Node
- ASP.NET
- PHP
- Ruby on Rails
All tutorials
https://docs.dhtmlx.com/gantt/desktop__howtostart_guides.html
Video guides
https://www.youtube.com/user/dhtmlx/videos
Features
Functionality | GNU GPL v2 | Commercial | Enterprise | Ultimate |
---|---|---|---|---|
Standard features | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Auto scheduling | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Baselines, deadlines and other custom elements | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Critical path calculation | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Custom content in the overlay | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Custom tasks types | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Decimal units for tasks durations | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Dynamic loading | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Expanding/collapsing split tasks | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Free local module for MS Project export/import | :x: | :x: | :x: | :heavy_check_mark: |
Free local PDF/PNG export module | :x: | :x: | :heavy_check_mark: | :heavy_check_mark: |
MS Project link formatting | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Multiple resources per task | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Online export to PDF/PNG without watermark | :x: | 1 year | 1 year | Perpetual |
Project-level work calendars | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Project and milestones task types | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Resizing grid columns and the grid itself from the UI | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Resource histogram | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Resource management | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
S-curve to show the progress of a project | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Setting task types automatically | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Several Gantt charts on 1 page | :x: | :x: | :heavy_check_mark: | :heavy_check_mark: |
Simple API for hiding/showing columns of the grid | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Splitting tasks into subtasks | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Tasks grouping | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Time constraints for tasks | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Working calendar for the whole project | :x: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
Follow us
Star our GitHub repo :star:
Check our roadmap for future updates :wrench:
Read us on Medium :newspaper:
Follow us on Twitter :bird:
Like our page on Facebook :thumbsup:
License
dhtmlxGantt v.7.1.13 Standard
This version of dhtmlxGantt is distributed under GPL 2.0 license and can be legally used in GPL projects.
To use dhtmlxGantt in non-GPL projects (and get Pro version of the product), please obtain Commercial/Enterprise or Ultimate license on our site https://dhtmlx.com/docs/products/dhtmlxGantt/#licensing or contact us at [email protected]
(c) XB Software Ltd.
Useful links
*Note that all licence references and agreements mentioned in the DHTMLX Gantt README section above
are relevant to that project's source code only.