Highcharts.ganttChart('container', { title: { text: 'Highcharts Gantt Chart' }, yAxis: { uniqueNames: true }, accessibility: { point: { descriptionFormat: '{yCategory}. ' + '{#if completed}Task {(multiply completed.amount 100):.1f}% completed. {/if}' + 'Start {x:%Y-%m-%d}, end {x2:%Y-%m-%d}.' } }, lang: { accessibility: { axis: { xAxisDescriptionPlural: 'The chart has a two-part X axis showing time in both week numbers and days.' } } }, series: [{ name: 'Project 1', data: [{ start: Date.UTC(2018, 11, 1), end: Date.UTC(2018, 11, 2), completed: { amount: 0.95 }, name: 'Prototyping' }, { start: Date.UTC(2018, 11, 2), end: Date.UTC(2018, 11, 5), completed: { amount: 0.444 }, name: 'Development' }, { start: Date.UTC(2018, 11, 8), end: Date.UTC(2018, 11, 9), completed: { amount: 0.141 }, name: 'Testing' }, { start: Date.UTC(2018, 11, 9), end: Date.UTC(2018, 11, 19), completed: { amount: 0.3, fill: '#fa0' }, name: 'Development' }, { start: Date.UTC(2018, 11, 10), end: Date.UTC(2018, 11, 23), name: 'Testing' }] }] }); // Activate the custom button document.getElementById('pdf').addEventListener('click', function () { Highcharts.charts[0].exportChart({ type: 'application/pdf' }); });
Install with NPM
The official Highcharts NPM package comes with support for CommonJS and contains Highcharts, and its Stock, Maps and Gantt packages.
npm install highcharts --save
See more installation optionsDownload our library
The zip archive contains Javascript files and examples. Unzip the zip package and open index.html in your browser to see the examples.
DownloadBuy a license
You can download and try out all Highcharts products for free. Once your project/product is ready for launch, purchase a commercial license.
See License Pricing