html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var stage = anychart.graphics.create("container");

​

    var pyramidChart = anychart.pyramid([

        {x: "Physical", value: 70},

        {x: "Data Link", value: 60},

        {x: "Network", value: 50},

        {x: "Transport", value: 40},

        {x: "Session", value: 30},

        {x: "Presentation", value: 20},

        {x: "Application", value: 10}

    ]);

    pyramidChart.labels({fontColor: "#000000", position: "outside"});

    pyramidChart.bounds(0, 0, "50%", "100%");

    pyramidChart.connectorStroke("#607D8B", 2, "5 2", "round");

    pyramidChart.container(stage);

    pyramidChart.draw();

​

    var funnelChart = anychart.funnel([10, 3, 7, 10, 5]);

    funnelChart.bounds("50%", 0, "50%", "100%");

​

    // Get connector stroke.

    var pyramidConnectorStroke = pyramidChart.connectorStroke();

​

    funnelChart.connectorStroke(pyramidConnectorStroke);

    funnelChart.container(stage);

    funnelChart.draw();

​

    var customTitle = anychart.standalones.title();

    customTitle.text("Get and use chart stroke.");

    customTitle.container(stage);

    customTitle.draw();

});