<!doctype html>
<html lang="en">
<head>
  <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
  <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
  <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script>
  <script>


var options = {
	chart: {
	    plotBackgroundColor: null,
	    plotBorderWidth: null,
	    plotShadow: false,
	    renderTo:'container'
	},
	title: {
	    text: '޸ĳҪ',
	},



	tooltip: {
	  pointFormat: '{series.name}: <b>{point.y}</b>'
	},


   xAxis: {
            categories: ['0', '1', '2', '3', '4', '5','6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24']
        },




	labels:{
		items:[{
			
			style: {
				left:'532px',
				top:'160px',				
			}
		}],
		style:{
			color:'red',
			fontSize:45,
			fontWeight:'bold',
			zIndex:1000
		}
	},
       series: [{
            name: '',
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        }, {
            name: '',
            data: [29.9, 71.5, 106.4, 12.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]

        }] 
};

$(document).ready(function(){
	var chart = new Highcharts.Chart(options);
	
	$("button.change").click(function(){
		var type = $(this).html();
		
		if(type == "pie") {
			options.tooltip.pointFormat = '{series.name}: <b>{point.percentage:.1f}%</b>';
		}else {
			options.tooltip.pointFormat = '{series.name}: <b>{point.y}</b>';
		}
		options.chart.type = type;
		chart = new Highcharts.Chart(options);
	});
});				



    //Javascript
  </script>
</head>
<body>
  <div id="container" style="min-width:700px;height:310px"></div>
  <div style="margin:10px 0px 10px 20px;">
      лͼ
      <button class="change">line</button>
      <button class="change">spline</button>
      <button class="change">pie</button>
      <button class="change">area</button>
      <button class="change">column</button>
      <button class="change">areaspline</button>
      <button class="change">bar</button>
      <button class="change">scatter</button>
  </div>
</body>
</html>
  </div>
</body>
</html>