我需要安装任何东西才能运行Highchart吗?

时间:2015-12-03 01:21:06

标签: javascript php html highcharts

我正在编写一个简单的程序,它将打印高级图,但只获得一个空白页。

我的代码:

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="Highcharts-2.2.2/js/highcharts.js"></script><script type="text/javascript">$(document).ready(function()var options={chart:{renderTo:'container',type:'spline'},title:{text:'survey data'},subtitle:{text:'from survey form'},
xAxis:{categories:['Jan 2008','Feb 2008','March 2008','April 2008','May 2008'],tickInterval:3},
yAxis:{title:`text:'Percentage %'},min:0
},plotOptions:{series:{lineWidth:2}},series:[{name:'Internet Explorer',data:[54.7,54.7,53.9,54.8,54.4,60.1,64.3,66.1]},{name:'FireFox',data:[36.7,36.1,37.0,39.1,39.8,40.1,43.7]},{name:'Safari',data:[1.9,2.0,2.1,2.2,2.4,2.6,2.8]},{
name:'Opera',data:[1.4,1,4,1.4,1.4,1.4,1.5,1.7,1.9]}]});});
        </script>
    </head>
    <body>
        <div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"> </div>
    </body>
</html>

我在XAMPP上以localhost/folder_name/file_name.php运行

2 个答案:

答案 0 :(得分:1)

我认为您已经设置了HighChart选项,但我没有看到任何初始化代码,您可能希望在代码中添加类似的内容

chart = new Highcharts.Chart(options);

答案 1 :(得分:1)

您的逗号/括号有一些语法错误。

$(document).ready(function () {
    var options = {
      chart: {
        renderTo: 'container',
        type: 'spline'
      },
      title: {
        text: 'survey data'
      },
      subtitle: {
        text: 'from survey form'
      },
      xAxis: {
        categories: ['Jan 2008', 'Feb 2008', 'March 2008', 'April 2008', 'May 2008'],
        tickInterval: 3
      },
      yAxis: {
        title: {
          'text': 'Percentage %'
        },
        min: 0
      },
      plotOptions: {
        series: {
          lineWidth: 2
        }
      },
      series: [{
        name: 'Internet Explorer',
        data: [54.7, 54.7, 53.9, 54.8, 54.4, 60.1, 64.3, 66.1]
      }, {
        name: 'FireFox',
        data: [36.7, 36.1, 37.0, 39.1, 39.8, 40.1, 43.7]
      }, {
        name: 'Safari',
        data: [1.9, 2.0, 2.1, 2.2, 2.4, 2.6, 2.8]
      }, {
        name: 'Opera',
        data: [1.4, 1, 4, 1.4, 1.4, 1.4, 1.5, 1.7, 1.9]
      }]
    };

      var chart = new Highcharts.Chart(options);
    });

修正了演示:http://jsfiddle.net/29nm99fo/1/