2014-05-11 109 views
0

民間,圖例對齊問題JQPlot

我們在對齊組條形圖的傳說時有些困難。

基本上我們希望在一個單一的原料水平對齊傳說但傳說在不同的線來

也圖例與軸線重疊我們嘗試marginTop,marginLeft但它不採取任何效果。

代碼

<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="excanvas.js"></script><![endif]--> 
<script language="javascript" type="text/javascript" src="jquery.min.js"></script> 
<script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script> 
<script type="text/javascript" src="plugins/jqplot.barRenderer.min.js"></script> 
<script type="text/javascript" src="plugins/jqplot.pieRenderer.min.js"></script> 
<script type="text/javascript" src="plugins/jqplot.categoryAxisRenderer.min.js"></script> 
<script type="text/javascript" src="plugins/jqplot.pointLabels.min.js"></script> 
<link rel="stylesheet" type="text/css" href="jquery.jqplot.css" /> 

<div id="chart2" style="height:400px;width:300px; "></div> 

<script> 

$(document).ready(function(){ 
var s1 = [2, 6, 7, 10]; 
var s2 = [7, 5, 3, 2]; 
var s3 = [7, 5, 3, 3]; 
var ticks = ['a', 'b', 'c', 'd']; 
plot2 = $.jqplot('chart2', [s1, s2, s3], { 
seriesDefaults: { 
renderer:$.jqplot.BarRenderer, 
pointLabels: { show: true,stackValue:true } 
}, 
axes: { 
xaxis: { 
renderer: $.jqplot.CategoryAxisRenderer, 
ticks: ticks 
} 
}, 
legend: { 
renderer: jQuery.jqplot.EnhancedLegendRenderer, 
show: true, 
location: 's', 
placement: 'outside', 
rendererOptions: { 
numberRows: '1', 
numberColumns: '3' 
} 
} 

}); 
}); 

回答

0

您需要加載enhancedLegendRenderer爲了使用它:

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

請參見工作示例here(使用enhancedLegendRenderer作爲外部資源)