anychart.core.gantt.elements.MilestonesElement.stroke set asFunc | samples | elements | gantt | core | API Reference

HTMLcopy

 
<div id="container"></div>

CSScopy

 
html, body, #container {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

JavaScriptAutocompletecopy

​x
 
anychart.onDocumentReady(function () {
    var data = getData();
    var chart = anychart.ganttProject();
    chart.defaultRowHeight(40);
    chart.data(data, 'as-tree');
    var timeline = chart.getTimeline();
    chart.xScale().minimumGap(0.2).maximumGap(0.2);
​
    //Getting the previews.
    var previews = timeline.milestones().preview();
    previews.enabled(true);
​
    //Styling previews.
    timeline.milestones().preview({
        fill: 'lightgreen',
        stroke: 'purple'
    });
​
    chart.title('Milestones previews displayed on grouping tasks.');
    chart.container('container');
    chart.draw();
    chart.fitAll();
});
​
function getData() {
    return [
        {
            id: 1,
            name: 'Collapsed grouping task',
            collapsed: true,
            children: [
                {
                    id: 2,
                    name: 'Milestone 1',
                    shortName: 'M1',
                    actualStart: Date.UTC(2019, 3, 1)
                },
                {
                    id: 3,
                    name: 'Milestone 2',
                    shortName: 'M2',
                    actualStart: Date.UTC(2019, 3, 10)
                },
                {
                    id: 3,
                    name: 'Milestone 3',
                    shortName: 'M3',
                    actualStart: Date.UTC(2019, 3, 14)
                },
                {
                    id: 4,
                    name: 'Milestone 4',
                    shortName: 'M4',
                    actualStart: Date.UTC(2019, 3, 20)
                }
            ]
        },
        {
            id: 5,
            name: 'Expanded grouping task',
            children: [
                {
                    id: 6,
                    name: 'Milestone 5',
                    shortName: 'M5',
                    actualStart: Date.UTC(2019, 3, 17)
                },
                {
                    id: 7,
                    name: 'Milestone 6',
                    shortName: 'M6',
                    actualStart: Date.UTC(2019, 4, 1)
                },
                {
                    id: 8,
                    name: 'Milestone 7',
                    shortName: 'M7',
                    actualStart: Date.UTC(2019, 4, 12)
                }
            ]
        }
    ];
}

Sample meta

AnyChart Documentation

ASYNC Rendering (Common Settings)

Drawing (Drawing Tools and Annotations)

Title (Common Settings)