How to Start with dhtmlxGantt

This section is dedicated to the very beginning of work with Gantt chart and its communication with a server using different technologies.

Basic initialization

Before you start learning how to build your application with Gantt on the server-side, take a look at how to initialize or, simply speaking, to display the Gantt chart on the page.

To display a basic Gantt on the page, follow 3 steps:

  1. Include the dhtmlxGantt code files on the page.
  2. Create a DIV container on the page.
  3. Initialize dhtmlxGantt in the newly created container with the init method. As a parameter the method takes an HTML container (or its id) that the Gantt chart will be displayed in.
<!DOCTYPE html>
<html>
<head>
   <script src="codebase/dhtmlxgantt.js"></script>
   <link href="codebase/dhtmlxgantt.css" rel="stylesheet">
</head>
<body>
    <div id="gantt_here" style='width:1000px; height:400px;'></div>
    <script type="text/javascript">
        gantt.init("gantt_here");
</script> </body> </html>

desktop/init_gantt_front.png

Related sample:  Basic initialization

For mode details, check the Initialization article.

Integration with server-side platforms

You can watch the video guide that shows how to create a Gantt chart on the page and load the data into it on the example of a Node.js platform.


Below you will find a brief overview of the guides which tell you about basic Gantt initialization on different server-side platforms to suit all tastes and preferences.

dhtmlxGantt with ASP.NET Core
A comprehensive tutorial that describes how to use Gantt together with ASP.Net Core.
dhtmlxGantt with ASP.NET MVC
An elaborated tutorial that explores the specificity of implementing a Gantt chart with ASP.NET MVC and ASP.NET WebAPI 2.
dhtmlxGantt with Node.js
A detailed tutorial which dwells on Gantt chart implementation on a Node.js platform.
dhtmlxGantt with PHP: Laravel
A comprehensive tutorial that discusses how to add Gantt into a Laravel app.
dhtmlxGantt with PHP:Slim
A comprehensive tutorial that discusses how to implement a PHP-based Gantt using a Slim 4 Framework.
dhtmlxGantt with Python
A detailed tutorial which teaches how to implement a Python-based Gantt using a Django 4 Framework.
dhtmlxGantt with Salesforce LWC
An extensive tutorial that helps you to create a Gantt chart inside SalesForce Lightning Web Component.
dhtmlxGantt with Ruby on Rails
An easy to reproduce tutorial that will walk you through the stages of implementing a Gantt chart on the base of Ruby on Rails.
Back to top