2015-04-02 43 views
2

我正在嘗試使用數據庫數據從canvasjs中創建線段。但是我在將數據傳遞給數據點時遇到了問題。將變量傳遞給canvasjs中的數據點

$.ajax({ 
    dataType : "json", 
    type: "POST", 
    url: base_url + 'index.php/dashboard/line_graph', 
    data: {}, 
    success: function(data) 
    { 
     for(var i = 0; i < data.length; i++) 
     { 
      var firstdate = data[i].nextdate; 
      var res = firstdate.replace(/[-]/g,','); 
      fd += '{ x: new Date(' + res + '), y:' + data[i].count +'},'; 
     } 
     var fin = fd.slice(0,-1); 
     finals = "[" + fin + "]";    
       var chart = new CanvasJS.Chart("chartContainer", 
        { 

        title:{ 
        text: "Booking - per month (DEMO)" 
        }, 
        data: [ 
        { 
         type: "line", 

         dataPoints: finals 

        } 
        ] 
        }); 

        chart.render(); 

    } 
}); 

當我提醒finals和複製驚動數據粘貼到數據點,然後運行它的工作。但是,當包含相同數據的變量傳遞給數據點時,則不起作用。

在控制檯日誌中,出現此錯誤。

TypeError: l.dataPoints[q].x is undefined 

數據點的格式是這樣的。當我做警報時,變量finals也包含相同的數據。

[ 
{ x: new Date(2015,03,6), y:4}, 
{ x: new Date(2015,03,11), y:0}, 
{ x: new Date(2015,03,16), y:0}, 
{ x: new Date(2015,03,21), y:0}, 
{ x: new Date(2015,03,26), y:0}, 
{ x: new Date(2015,03,31), y:14} 
] 

我的頁面返回這個json_encode格式。

[ 
{"firstdate":"2015-03-01","nextdate":"2015-03-6","count":"4"},  
{"firstdate":"2015-03-6","nextdate":"2015-03-11","count":"0"}, 
{"firstdate":"2015-03-11","nextdate":"2015-03-16","count":"0"}, 
{"firstdate":"2015-03-16","nextdate":"2015-03-21","count":"0"}, 
{"firstdate":"2015-03-21","nextdate":"2015-03-26","count":"0"}, 
{"firstdate":"2015-03-26","nextdate":"2015-03-31","count":"14"} 
] 

我不明白這個問題。請幫忙。

+0

嗨,你可以添加你的網頁'index.php/dashboard/line_graph'返回什麼數據? – jmgross 2015-04-02 08:09:24

+0

嗨,我編輯了我的問題。 linegraph返回json格式。 – user254153 2015-04-02 08:22:32

回答

3

您不必創建finals變量像一個字符串,可以直接使用對象中的JavaScript的格式:

$.ajax({ 
    type: "POST", 
    url: base_url + 'index.php/dashboard/line_graph', 
    data: {}, 
    success: function(data) 
    { 
     var tabData = JSON.parse(data); 
     var finals = []; 
     for(var i = 0; i < tabData.length; i++) 
     { 
      var firstdate = tabData[i].nextdate; 
      var res = firstdate.split('-'); 
      finals.push({ 'x': new Date(res[2],res[1],res[0]), 'y': tabData[i].count }); 
     } 
     var chart = new CanvasJS.Chart("chartContainer",{ 
      title:{ 
       text: "Booking - per month (DEMO)" 
      }, 
      data: [ 
       { 
        type: "line", 
        dataPoints: finals 
       } 
      ] 
     }); 

     chart.render(); 
    } 
}); 
+0

也許你必須將'tabData [i] .count'轉換爲Integer與['parseInt'函數](http://www.w3schools.com/jsref/jsref_parseint.asp) – jmgross 2015-04-02 08:39:59

1

不要創建每一件事作爲一個字符串:

var finals = []; 
for(var i = 0; i < data.length; i++) 
{ 
    var firstdate = data[i].nextdate; 
    var res = firstdate.replace(/[-]/g,','); 
    finals.push({ x: new Date(res), y: parseInt(data[i].count)}); 
} 
-1

傳遞數據如 dataPoints:JSON.parse(data)

而不是 dataPoints:data