$(document).ready(function() {
	var data = $('#data').text().split('|');
	for (var i=0; i<data.length; i++)
		data[i] = parseInt(data[i]);
		
	var chart = new Highcharts.Chart({
	   chart: {
	      renderTo: 'chart1',
	      defaultSeriesType: 'line',
	      margin: [50, 10, 50, 60]
	   },
	   title: {
	      text: 'WooRank distribution',
	      style: {
	         margin: '0 auto'
	      }
	   },
	   subtitle: {
	      text: 'What are the most common ranks?'
	   },
	   xAxis: {
	      categories: ['5', '10', '15', '20', '25', '30', 
	         '35', '40', '45', '50', '55', '60', '65',
			 '70', '75', '80', '85', '90', '95', '100'],
	      title: {
	         text: 'Rank'
	      }
	   },
	   yAxis: {
		  min: 0,
	      title: {
	         text: 'Occurence'
	      },
	      plotLines: [{
	         value: 0,
	         width: 1,
	         color: '#808080'
	      }]
	   },
	   tooltip: {
	      formatter: function() {
				return '<strong>'+this.y+'</strong>';
	      }
	   },
	   legend: {
	      enabled: false
	   },
	   series: [{
	      name: 'Distribution',
	      data: data
	   }]
	});
});