Vue.js
Lightning-Fast Vue JS Gantt Chart
Create a Vue Gantt chart by using DHTMLX Gantt and let users manage projects and tasks on the fly.
Try DHTMLX Vue JS Gantt Chart Live Demo
Open a demo on desktop
DHTMLX Gantt has already been used for managing thousands of projects worldwide.
How to Create Vue JS Gantt Chart
5 steps to start with DHTMLX Gantt in Vue JS:
1.
Create a Vue component for Gantt and add the container for Gantt in
the template container.
2.
Import Gantt and its CSS file.
3.
Create the Gantt instance in the mounted function and add the Gantt
configuration there.
4.
Attach the Gantt instance to the internal object to access it
later in the unmounted function.
5.
Destroy the Gantt Instance in the unmounted function to clean up when Gantt
is no longer needed.
Vue JS Gantt Chart Features
DHTMLX Gantt Integrations
Why Use DHTMLX Vue JS Gantt Chart?
Simple initialization
Starting building a Gantt chart with DHTMLX is a breeze even if you're not a
JavaScript expert. You can easily initialize it with a few lines of code and
outfit it with desired features drawn from the API. You may always be assisted
with demos, step-by-step guides, and video tutorials.
Extensive functionality out of the box
Being the most complete Gantt chart library, DHTMLX Gantt provides all the necessary
features for effective project management, including different task types, auto
scheduling, and resource management.
Ease of customization
You can adjust the component to meet your requirements with the help of API
properties. You are free to customize the Vue Gantt timeline, scales, grid, tasks,
and editing form. Besides, you can manipulate the size of scales and cells and
equip Gantt with tooltips, baselines, and custom elements.
Stable with high performance
When it comes to handling large multi-thousand-task projects, robust and flawless
performance is a must. DHTMLX Gantt can load any desired number of tasks smoothly
with the help of smart rendering and dynamic loading.
Cross-browser and versatile
DHTMLX Gantt ensures seamless performance across various browsers, including Chrome,
Safari, and Firefox as well as all Chromium-based ones, e.g. Microsoft Edge, Opera,
and Vivaldi. Besides, it’s compatible with any front-end and back-end technologies.
What Customers Say
It's stable. It's easy to set up, even if you don’t have too much development
experience. It’s highly customizable. It's full of features out of the box (and
if something missing, you can write your own addon to cover missing functionality).
It's beautiful out of the box, which is not always the case for similar components.
Workload functionality is included, which is not the case for such components.
Dmitry (Dan) Dudin
CEO at GanttPRO
The API is extremely flexible, well documented and easy to understand if you need to
look at underlying source code. The support has been responsive and high quality.
We would absolutely recommend using DHTMLX and are even considering using some other
products that they offer based on our experience so far.
Hive Team
Team productivity platform
For Splitvice, dhtmlxGantt fits with what we need. It's a stand-alone component,
without an extra run-time fee. It's flexible and highly customizable. We get good
support when we need it, but most of our questions are found right in the knowledge
database.
Splitvice Team
Portfolio and project management tool
We were looking for a project management plugin to help reduce our time to market
and development costs. That is why we are using DHTMLX Gantt. I tested a free version
of your Gantt product and I was satisfied with the API provided with the plugin. Your
product fitted my needs and it was easy to integrate it into my application.
Thomas Meghe
senior developer at the French company Echo on
Documentation
Browse documentation
DHTMLX documentation provides API references along with all the necessary technical
guides and tutorials to quickly initialize, configure and customize the Gantt library.
Forum
Access our community forum
The forum keeps tons of shared knowledge of working with Gantt in Vue JS and other
technologies. It includes answers from our tech specialists and provides free access.
Free trial
Download a 30-day free trial
To make sure DHTMLX Gantt library meets your requirements, you have to download a free
30-day trial. It's an opportunity to test it extensively while also benefiting from
official technical support.
Github
Find demo sources on GitHub
We added the demo sources of DHTMLX Gantt library for Vue.js framework. The complete demo
is implemented with the help of our JavaScript Gantt.
Official tech support
Benefit from DHTMLX support
Our team supports every user of DHTMLX Gantt library. You can explore the levels of
support we provide for trial users and owners of proprietary and open-source licenses.
Integrations
Integrate Gantt with anything
Apart from Vue JS framework, DHTMLX Gantt can be integrated with Angular, React,
Salesforce, ASP.Net, Node.js, and any other technology you need.
