2013-02-03 95 views
1

我正在使用JqPlot並對圖的寬度有疑問。顯示時這裏是圖的圖像:JqPlot圖太寬

Div Image

圖爲只是有點太寬。我可以請一些幫助,以使它的寬度稍小一些。這裏是DIV代碼:

<div id="box6"> 
<div class="extrawidechartbox"> 
    <div id="totalTakings" style="margin: 20px 0; width:1000px; height:500px;"></div> 
    <table style='width: 1000px; margin: 0 20px'> 
       <thead> 
       <tr> 
        <th>Select</th> 
        <th>Day</th>     
       </tr> 
       </thead> 
       <tbody> 

    <? //print_r($takingsArray); ?>   
    <tr> 
     <td width='30'><input type='checkbox' name='day_name0' class='daycheck' value='0' <? echo ($takingsArray[0]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#329dd5;font-weight:bold'>Week Totals</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name1' class='daycheck' value='1' checked <? echo ($takingsArray[1]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#0d8e17;font-weight:bold'>Monday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name2' class='daycheck' value='2' checked <? echo ($takingsArray[2]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#f47320;font-weight:bold'>Tuesday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name3' class='daycheck' value='3' checked <? echo ($takingsArray[3]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#7678ab;font-weight:bold'>Wednesday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name4' class='daycheck' value='4' checked <? echo ($takingsArray[4]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#ecd77e;font-weight:bold'>Thursday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name5' class='daycheck' value='5' checked <? echo ($takingsArray[5]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#84b586;font-weight:bold'>Friday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name6' class='daycheck' value='6' checked <? echo ($takingsArray[6]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#bc8b7c;font-weight:bold'>Saturday</a></td> 
    </tr> 
    <tr> 
     <td width='30'><input type='checkbox' name='day_name7' class='daycheck' value='7' checked <? echo ($takingsArray[7]=='no data')?' disabled ':''; ?>></td> 
     <td align='left' width='80' class='day'><a href='#' style='color:#015253;font-weight:bold'>Sunday</a></td> 
    </tr> 
    </tbody> 
    </table>   
</div> 

div id="totalTakings" is the code that actually contains the graph. 

這應該是很簡單的,但我不能找到解決方案。

+0

什麼'extrawidechartbox'的寬度是多少? –

回答

1

您可以應用特定的圖表大小。我開了這個話題在這裏一個問題:JqPlot : Set a fix height value for the graph area not including y axe labels

的解決辦法是用精確的圖表大小像這樣重新繪製:

var w = parseInt($(".jqplot-yaxis").width(), 10) + parseInt($("#chart").width(), 10); 
var h = parseInt($(".jqplot-title").height(), 10) + parseInt($(".jqplot-xaxis").height(), 10) + parseInt($("#chart").height(), 10); 
$("#chart").width(w).height(h); 
plot.replot();