html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function() {

    var dataSet = anychart.data.set([

[1980, 20],

[1981, 22],

[1982, 21],

[1983, 25],

[1984, 19],

[1985, 28],

[1986, 27],

[1987, 18],

[1988, 23],

[1989, 15],

[1990, 10],

[1991, 12],

[1992, 11],

[1993, 15],

[1994, 20],

[1995, 22],

[1996, 21],

[1997, 25],

[1998, 31],

[1999, 32],

[2000, 28],

[2001, 29],

[2002, 40],

[2003, 41],

[2004, 45],

[2005, 50],

[2006, 65],

[2007, 45],

[2008, 50],

[2009, 51],

[2010, 65],

[2011, 60],

[2012, 62],

[2013, 65],

[2014, 45]

    ]);

​

  var chart = anychart.cartesian();

  // set chart margin settings

  chart.margin(0);

​

  var series = chart.spline(dataSet.mapAs({x: [0], value: [1]}));

series.name("Youth unemployment ratio in Nevada");

series.tooltip().format(function(){

    return ("Ratio: "+this.value+"%");

});

​

  // create the title

  chart.title("Single-hovering feature");

​

  // turn on grids

  var grid = chart.grid(0);

  grid.enabled(true);

  var grid1 = chart.grid(1);

  grid1.enabled(true);

  grid1.layout("vertical");

  var minorGrid = chart.minorGrid();

  minorGrid.enabled(true);

  var minorGrid1 = chart.minorGrid(1);

  minorGrid1.enabled(true);

  minorGrid1.layout("vertical");

​

  // set chart axes settings

  var scale = anychart.scales.linear();

  chart.xScale(scale);

  var xAxis = chart.xAxis();

  xAxis.minorTicks(true);

  var yAxis = chart.yAxis();

  yAxis.minorTicks(true);

​

  //set chart legend settings

  var legend = chart.legend();

  legend.enabled(true);

  var legendPadding = legend.padding();

  legendPadding.bottom(30);

  chart.background(false);

​

  series.markers(true);

  var hoverMarkers = series.hoverMarkers();

  hoverMarkers.enabled(true);

  hoverMarkers.fill("yellow");

​

  // multi-hover enabling 

  chart.interactivity("byX");

​

  chart.crosshair(true);

  chart.container("container");

  chart.draw();

});