html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    // To change the way how context menu looks you need to change CSS.

    // By default CSS from AnyChart CDN is used: https://cdn.anychart.com/releases/8.13.0/css/anychart-ui.min.css

    // Download it, alter, upload to your server and link from your pages to change the look.

​

    var data = [

        {id: 1, name: 'Phase 1 - Strategic Plan', progressValue: 0.14, actualStart: '2000-02-24', actualEnd: '2000-02-27'},

        {id: 2, name: 'Self-Assessment', parent: 1, progressValue: 0.25, actualStart: '2000-02-24', actualEnd: '2000-02-29'},

        {id: 3, name: 'Define business vision', parent: 2, progressValue: 0, actualStart: '2000-02-24T24:00', actualEnd: '2000-02-25T09:00', connectTo: 4, connectorType: 'finish-start'},

        {id: 4, name: 'Identify available skills, information and support', parent: 2, progressValue: 0, actualStart: '2000-02-26T00:00', actualEnd: '2000-02-26T09:00', connectTo: 5, connectorType: 'finish-start'},

        {id: 5, name: 'Decide whether to proceed', parent: 2, progressValue: 0, actualStart: '2000-02-27', actualEnd: '2000-02-28T08:00', connectTo: 6, connectorType: 'finish-start'},

        {id: 6, name: 'Define the Opportunity', parent: 1, progressValue: 0.27, actualStart: '2000-02-28T08:00', actualEnd: '2000-02-29'}

    ];

​

    var chart = anychart.ganttProject();

​

    var toolbar = anychart.ui.ganttToolbar();

    toolbar.container('container');

    toolbar.target(chart);

    toolbar.printPaperSizes(['A0', 'A4']);

    toolbar.draw();

​

    chart.data(data, 'as-table');

​

    // Get the paper size for print.

    var printPaperSizes = toolbar.printPaperSizes();

​

    var dataGrid = chart.dataGrid();

​

    var column = dataGrid.column(1);

    column.title('Paper size is ' + printPaperSizes);

​

    chart.container('container');

    chart.draw();

    chart.fitAll();

});