jQuery Flot餅圖不顯示

我想用Flot製作餅圖但我的餅圖不會顯示出來。jQuery Flot餅圖不顯示

這裏是我的代碼：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
    "http://www.w3.org/TR/html4/strict.dtd"> 

    <link rel="stylesheet" type="text/css" href="style.css"> 
<head> 

    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery.flot.js"></script> 
    <script type="text/javascript"> 
    $(function() { 

    var data = [ 
    {label: "Pause", data:150}, 
    {label: "No Pause", data:100}, 
    {label: "Sleeping", data:250} 
]; 
var options = { 
    series: { 
     pie: {show: true} 
    }, 
    legend: { 
     show: false 
    } 
}; 

$.plot($("#pie-placeholder"), data, options); 


    }); 
    </script> 
</head> 
<body> 
<div id="pie-placeholder" class="flot"></div> 
</body> 
</html>

而且我的CSS文件：

.flot { 
    width: 500px; 
    height: 500px; 
}

沒有什麼真的很辛苦，但餅圖將不會出現。

這裏是我的圖表看起來像現在：

我沒有任何錯誤，所以我不明白什麼是錯的。

你能幫助我嗎？

謝謝！

來源

2016-05-24 Folker

我沒有看到你包括jquery.flot.pie.js。如果你檢查Flot's pie chart example的來源，你會發現你需要包含餅圖插件。確保您的jquery.flot.pie.js文件位於其他flot javascript文件中，並在HTML標頭中的jquery.flot.js腳本標記之後添加下面的行。

<script type="text/javascript" src="jquery.flot.pie.js"></script>

來源

2016-05-24 14:17:57 mechenbier

您需要包括pie plugin。

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="jquery.flot.js"></script> 
<script type="text/javascript" src="jquery.flot.pie.js"></script>

演示JSFiddle。

我看到你包裝你的代碼

$(function() { 
    // your code 
});

雖然我不知道爲什麼你傳遞jQuery的匿名函數。雖然代碼仍然會運行我會刪除它，或者如果您嘗試執行IIFE（immediately invoked function expression），我會執行以下操作：

(function() { 
    // your code 
})();

來源

2016-05-24 14:18:26 hungerstar

jQuery Flot餅圖不顯示

回答

相關問題