Highcharts沒有顯示任何東西只是空白的HTML頁面

我試圖用highchart網站給出的例子。但是，當我使用它，我得到的是一個空白的HTML頁面。有人請幫我看看代碼。我不明白爲什麼代碼沒有正確加載，請告訴我，如果我要補充額外的東西到這一點，請不要讓我知道如何使用PHP數組，使該圖的工作也Highcharts沒有顯示任何東西只是空白的HTML頁面

<html> 
<head> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script> 
<script> 
$(function() { 
    var chart; 
    $(document).ready(function() { 
    chart = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      plotBackgroundColor: null, 
      plotBorderWidth: null, 
      plotShadow: false 
     }, 
     title: { 
      text: 'Browser market shares at a specific website, 2010' 
     }, 
     tooltip: { 
      pointFormat: '{series.name}: <b>{point.percentage}%</b>', 
      percentageDecimals: 1 
     }, 
     plotOptions: { 
      pie: { 
       allowPointSelect: true, 
       cursor: 'pointer', 
       dataLabels: { 
        enabled: true, 
        color: '#000000', 
        connectorColor: '#000000', 
        formatter: function() { 
         return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; 
        } 
       } 
      } 
     }, 
     series: [{ 
      type: 'pie', 
      name: 'Browser share', 
      data: [ 
       ['Firefox', 45.0], 
       ['IE',  26.8], 
       { 
        name: 'Chrome', 
        y: 12.8, 
        sliced: true, 
        selected: true 
       }, 
       ['Safari', 8.5], 
       ['Opera',  6.2], 
       ['Others', 0.7] 
      ] 
     }] 
    }); 
}); 

}); 
</script> 
</head> 
<body> 

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div> 
</body> 
</html>

來源

2013-03-02 user2038580

我相信你的問題是按照你包括腳本的順序。嘗試將jQuery的第一：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script>

演示（working/not working）。

更新：使用PHP從MySQL加載您的數據，請參閱this example。然而，正如你指出你自己，編碼它使用JSON可能是一個更好的選擇：

$data = array(); 

while($row = mysql_fetch_array($results)) { 
    $data[] = array($row[1], $row[0]); 
} 
echo json_encode($data);

這最後echo產生時，既可以用於返回使用AJAX（像上面的鏈接例子），全陣列式，或頁面本身（即「硬編碼」，它在腳本中）：

series: [{ 
     type: 'pie', 
     name: 'Browser share', 
     data: <?php echo json_encode($data)?> 
    }]

這會因爲你的陣列工作，當JSON編碼，可代替JavaScript的文字（的使用和json_encode應採取逃避的護理一切，防止XSS漏洞）。

來源

2013-03-02 01:40:40 mgibsonbr

你知道如何從MySQL中使用php的值，並將其傳遞到此？來自mysql的數據格式如下：24 Afghanistanisthan 6 Iran 11 KSA 21 Pakistan 14 UAE – user2038580 2013-03-02 01:53:36

@ user2038580 [this]（http://blueflame-software.com/blog/using-highcharts-with- php-and-mysql /）看起來像一個很好的資源 – mgibsonbr 2013-03-02 01:55:29

看到我將使用的查詢是： SELECT SUM（score），國籍 FROM詳情 GROUP BY國籍限制0,30我想知道如何使用在javascript中從這裏檢索的值。 – user2038580 2013-03-02 01:57:37

包括JavaScript的應該是順序：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"  type="text/javascript"></script> 
<script src="http://code.highcharts.com/highcharts.js"></script> 
<script src="http://code.highcharts.com/modules/exporting.js"></script>

我的意思是，你必須任何其他腳本之前首先包括jQuery庫。

來源

2013-03-02 01:42:00

花花公子你的救命啊:) – user2038580 2013-03-02 01:50:28

你知道如何從MySQL中使用php的值，並將其傳遞到此？從MySQL的數據FORMATT如下：24 Afghanisthan 6伊朗 11 KSA 21巴基斯坦 14阿聯酋 – user2038580 2013-03-02 01:51:50

看到我將要使用的查詢是： SELECT SUM（得分），國籍從細節 GROUP BY國籍限制0,30我想知道如何使用從javascript中檢索到的值。 – user2038580 2013-03-02 01:58:31

Highcharts沒有顯示任何東西只是空白的HTML頁面

回答

相關問題