html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

  // xml data

  var xml = '<?xml version="1.0" encoding="utf-8"?>' +

    '<anychart xmlns="https://cdn.anychart.com/schemas/8.7.1/xml-schema.xsd">' +

      // set chart type, title and chart container

      '<chart type="column" container="container" title="XML Visual Settings">' +

        // chart series

        '<series_list>'+

          // series settings

          '<series fill="gold" stroke="gray" hover_stroke="darkred" hatch_fill="diagonal-brick">' +

            // customize hatch fill on mouse over

            '<hover_hatch_fill type="diagonal-brick" color="darkred"/>'+

            // data set

            '<data>' +

              '<point x="P1" value="128.14"/>'+

              '<point x="P2" value="112.61"/>'+

              '<point x="P3" value="163.21"/>'+

              '<point x="P4" value="229.98"/>'+

              '<point x="P5" value="90.54"/>'+

              '<point x="P6" value="104.19"/>'+

              '<point x="P7" value="150.67"/>'+

              '<point x="P8" value="120.43"/>'+

              '<point x="P9" value="143.76"/>'+

              '<point x="P10" value="191.34"/>'+

              '<point x="P11" value="134.17"/>'+

              '<point x="P12" value="145.72"/>'+

              '<point x="P13" value="222.56"/>'+

              '<point x="P14" value="187.12"/>'+

              '<point x="P15" value="154.32"/>'+

              '<point x="P16" value="133.08"/>'+

            '</data>'+

          '</series>'+

        '</series_list>'+

      '</chart>'+

    '</anychart>';

​

  // get XML data

  var chart = anychart.fromXml(xml);

​

  // draw chart

  chart.draw();

});