html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

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

​

    var chart = anychart.candlestick();

    chart.xScale().maximum(Date.UTC(2017, 2, 29));

    chart.xScale().minimum(Date.UTC(2017, 2, 24));

​

    var series = chart.candlestick([

        {x: Date.UTC(2017, 2, 25), open: 511.53, high: 514.98, low: 505.79, close: 506.40},

        {x: Date.UTC(2017, 2, 26), open: 507.84, high: 513.30, low: 507.23, close: 512.88},

        {x: Date.UTC(2017, 2, 27), open: 512.36, high: 515.40, low: 510.58, close: 511.40},

        {x: Date.UTC(2017, 2, 28), open: 515.02, high: 520.50, low: 511.47, close: 517.25}

    ]);

​

    var state = series.normal();

​

    var pattern = stage.pattern(new anychart.graphics.math.Rect(0, 0, 20, 20));

    pattern.star5(10, 10, 8).stroke('#838b8b');

​

    // Set falling hatch fill.

    state.fallingHatchFill(pattern);

​

    chart.title('Set falling hatch fill as a pattern');

    chart.container(stage);

    chart.draw();

});