2012-05-10 152 views
2

目前我似乎無法在條形圖內生成任何數據。我不確定錯誤是否與我創建的JSON字符串或jQuery代碼有關。無法填充jqPlot條形圖

編輯:(一旦我改變了陣列所產生的基本曲線的單值,但仍然沒有條)

JSON字符串:[{"Name":"Poll Results","Serie":[[10],[14],[14],[19]]}]

的jQuery:

<script type="text/javascript"> 
//Enable JQuery IntelliSense for Visual Studio 
///<reference path="jquery-1.3.2-vsdoc.js2 /> 

jQuery(document).ready(function() { 
    urlDataJSON = '/Home/BarChartJSON'; 

    $.getJSON(urlDataJSON, "", function (data) { 
     var dataLines = []; 
     var dataLabels = ""; 
     $.each(data, function (entryindex, entry) { 
      dataLines.push(entry['Serie']); 
      dataLabels = dataLabels + entry['Name']; 
     }); 

     Plot(dataLines, dataLabels); 


     function Plot(dataLines, dataLabels) { 

      options = { 
       legend: { show: true }, 
       Title: 'Poll Results',     
       seriesDefaults: { 
        renderer: $.jqplot.BarRenderer, 
        pointLabels: { show: true, location: 'e', edgeTolerance: -15 }, 
        shadowAngle: 135, 
        renderOptions: { 
         barDirection: 'horizontal' 
        } 
       }, 
       axes: { 
        yaxis: { 
         renderer: $.jqplot.CategoryAxisRenderer 
        } 
       } 
      } 
     } 
     var plot = $.jqplot('barChart', [dataLines], options); 
    }); 
}); 

</script> 

    <h2>barChart</h2> 

<div id="barChart" style="height:600px;width:600px;"></div> 

partially generated Chart 的屏幕截圖顯示到目前爲止產生了什麼。

+0

我看過JSON字符串,並從中刪除額外的數據。我現在能夠生成基本圖形,但沒有出現條形圖。 –

回答

0

在代碼中有一些問題,例如,這不是必須的,選項應該是直接進入圖表的var。

Plot(dataLines, dataLabels); function Plot(dataLines, dataLabels) {

Check out this sample of code I did for the previous data you had.

它將與此JSON工作,以及它只會產生一個系列。

+0

所以你給我的代碼工作,但不是生成一個條形圖即時獲取我的本地主機上的線圖。任何想法可能導致這種情況? btw謝謝你的所有幫助。 –

+0

唯一值得關注的是'jqplot.barRenderer.js'沒有找到。它位於您必須下載的'jqPlot'文件夾內的'plugins'文件夾中。 – Boro

+0

的jqplot插件有錯誤的文件路徑。再次感謝隊友 –