html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // data

    var data = anychart.data.set([

  ["Jan", 10, 34],

  ["Feb", 12, 23],

  ["Mar", 11, 13],

  ["Apr", 15, 22],

  ["May", 20, 21],

  ["Jun", 22, 10],

  ["Jul", 21, 14],

  ["Aug", 25, 15],

  ["Sep", 11, 20],

  ["Oct", 12, 21],

  ["Nov", 14, 23],

  ["Dec", 15, 25]

    ]);

​

  // map data for the each series

  var Sales2003 = data.mapAs({x: 0, value: 1});

  var Sales2004 = data.mapAs({x: 0, value: 2});

​

  // chart type

  var chart = anychart.column();

​

  // set data

  var series_1 = chart.column(Sales2003);

  series_1.name("Sales in 2013");

​

  var series_2 = chart.column(Sales2004);

  series_2.name("Sales in 2014");

​

​

  series_1.hovered().hatchFill("checker-board");

  series_2.hovered().hatchFill("checker-board");

​

​

  // chart title

  var title = chart.title();

  title.text("Hover over this title to enable the hover state for some points");

  title.enabled(true);

  // adding a listener

  title.listen("mouseOver", function() {

    series_1.hover([4, 6, 12, 16]);

    series_2.hover([0, 1, 5, 10, 11, 16, 17, 20]);

  });

  title.listen("mouseOut", function() {

    series_1.unhover();

    series_2.unhover();

  });

  // set axes titles

  chart.xAxis().title(false);

  chart.yAxis().title(false);

​

  // enable legend

  chart.legend(false);

​

  // adding a listener

  chart.title().listen("mouseOver", function() {

      series_1.hover([4, 6, 12, 16]);

      series_2.hover([0, 1, 5, 10, 11, 16, 17, 20]);

  });

  chart.title().listen("mouseOut", function() {

      series_1.unhover();

      series_2.unhover([0, 1, 5, 16, 17]);

  });

​

  // draw

  chart.container("container");

  chart.draw();

​

});