jqPlot條形圖不能正確渲染

我想在我的jQuery Mobile應用程序中開始使用jqPlot，但我似乎無法獲得jqPlot網站上的其中一個示例來工作。我的代碼：jqPlot條形圖不能正確渲染

var s1 = [2, 6, 7, 10]; 
var s2 = [7, 5, 3, 2]; 
var ticks = ['a', 'b', 'c', 'd']; 

$.jqplot('chartdiv', [s1, s2], { 
    seriesDefaults: { 
     renderer:$.jqplot.BarRenderer, 
     pointLabels: { show: true } 
    }, 
    axes: { 
     xaxis: { 
      renderer: $.jqplot.CategoryAxisRenderer, 
      ticks: ticks 
     } 
    } 
});

應該產生此圖：

Correct grpah

相反，我得到這樣的：

What I'm seeing

通知x軸標籤都呈現之上彼此在左下角。什麼可能導致圖表呈現錯誤？

來源

2012-09-24 jwien001

您是否包含CSS？ –

是的，jquery.jqplot.css文件包含在頁面中並加載。 – jwien001

圖表填充時最初是隱藏的圖表 –

我掙扎於同樣的問題。經過一些測試後，我發現我實際上沒有包含類別軸渲染器插件。

所以，如果你仍然有同樣的麻煩嘗試包括它。（plugins/jqplot.categoryAxisRenderer.min.js）

來源

2012-10-03 18:07:16 Kenny

這可能發生的另一個原因是，如果您將腳本以錯誤的順序添加到HTML文件中。請注意，必須先包含jquery，然後包含jqplot，最後包含任何插件。

<script type="text/javascript" src="jqplot/jquery.min.js"></script> 
<script type="text/javascript" src="jqplot/jquery.jqplot.min.js"></script> 

<script type="text/javascript" src="jqplot/plugins/jqplot.barRenderer.min.js"></script> 
<script type="text/javascript" src="jqplot/plugins/jqplot.categoryAxisRenderer.min.js></script> 
<script type="text/javascript" src="jqplot/plugins/jqplot.pointLabels.min.js"></script>

來源

2013-08-14 20:22:26 Dizzyspiral

我的問題是，對jqPlot腳本的引用放在頭塊內。在將它們替換爲body-block後，問題就解決了。

來源

2017-05-06 16:14:43 vaio

jqPlot條形圖不能正確渲染

回答

相關問題