ANYCHART - PERT Chart, how to add horizontal scroll - anychart

Question

We are using Anychart Version 7.13 to create a PERT Chart in our application. Our data has a series of tasks with predecessors that require the chart to scroll horizontally. Our chart is getting truncated and we have tried to adjust chart.width in both % and PX but not able to enable horizontal scroll.
Any help will be most appreciated.
Thanks
VikasScreenshot showing truncation on right

Answer 1

Also, you should adjust spacing between milestones and milestones size in %. This will allow the pert chart fitting into the stage width. I prepared a sample for you below, the chart is scrollable. Please, pay attention to CSS style, stage settings and size/spacing settings. Probably, you should try other values in % exactly for your pert chart.
anychart.onDocumentReady(function () {
// create data
var data = [
{id: "1", duration: 1, name: "Task A"},
{id: "2", duration: 3, name: "Task B", dependsOn:["1"]},
{id: "3", duration: 4, name: "Task C", dependsOn:["2"]},
{id: "4", duration: 1, name: "Task D", dependsOn:["3"]},
{id: "5", duration: 2, name: "Task E", dependsOn: ["4"]},
{id: "6", duration: 2, name: "Task F", dependsOn: ["5"]},
{id: "7", duration: 1, name: "Task G", dependsOn: ["6"]},
{id: "8", duration: 2, name: "Task H", dependsOn: ["7"]},
{id: "9", duration: 3, name: "Task I", dependsOn: ["8"]},
{id: "10", duration: 2, name: "Task J", dependsOn: ["9"]}
];
// create a chart
var chart = anychart.pert();
//create stage
var stage = anychart.graphics.create("container");
//set stage width
stage.width(2000);
// adjsut milestones size in %
chart.milestones().size('5%');
//adjust spacing in %
chart.horizontalSpacing("9%");
// set chart data
chart.data(data, "as-table");
//render chart
chart.container(stage).draw();
});
html, body, #container {
position: relative;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow-x: scroll;
}
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-base.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-pert.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-exports.min.js"></script>
<script src="https://cdn.anychart.com/releases/8.1.0/js/anychart-ui.min.js"></script>
<link href="https://cdn.anychart.com/releases/8.1.0/css/anychart-ui.min.css" rel="stylesheet"/>
<div id="container"></div>