html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var chart = anychart.scatter();

​

    chart.marker([

        {x: 4.1, value: 10},

        {x: 2.3, value: 6},

        {x: 3.4, value: 17}

    ]).hatchFill(true).size(20);

​

    chart.marker([

        {x: 4.4, value: 20},

        {x: 2.3, value: 11},

        {x: 3.1, value: 22}

    ]).hatchFill(true).size(20);

​

    chart.marker([

        {x: 4.8, value: 1},

        {x: 2.6, value: 16},

        {x: 3.9, value: 7}

    ]).hatchFill(true).size(20);

​

    // Set hatch fill palette.

    chart.hatchFillPalette(['percent50', 'diagonal-brick', 'zig-zag']);

​

    chart.title('Set hatch fill palette');

    chart.container('container');

    chart.draw();

});