使用d3繪製json數據in phant使用d3 js

我試圖使用d3.js將存儲在sparkfun cloud（IOT雲）中的數據可視化。 There is example using google chart for visualizing sparkfun cloud，使用下面的腳本：使用d3繪製json數據in phant使用d3 js

<!DOCTYPE html> 
<html> 
    <head> 
    <!-- EXTERNAL LIBS--> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <script src="https://www.google.com/jsapi"></script> 

    <!-- EXAMPLE SCRIPT --> 
    <script> 

     // onload callback 
     function drawChart() { 

     var public_key = 'dZ4EVmE8yGCRGx5XRX1W'; 

     // JSONP request 
     var jsonData = $.ajax({ 
      url: 'https://data.sparkfun.com/output/' + public_key + '.json', 
      data: {page: 1}, 
      dataType: 'jsonp', 
     }).done(function (results) { 

      var data = new google.visualization.DataTable(); 

      data.addColumn('datetime', 'Time'); 
      data.addColumn('number', 'Temp'); 
      data.addColumn('number', 'Wind Speed MPH'); 

      $.each(results, function (i, row) { 
      data.addRow([ 
       (new Date(row.timestamp)), 
       parseFloat(row.tempf), 
       parseFloat(row.windspeedmph) 
      ]); 
      }); 

      var chart = new google.visualization.LineChart($('#chart').get(0)); 

      chart.draw(data, { 
      title: 'Wimp Weather Station' 
      }); 

     }); 

     } 

     // load chart lib 
     google.load('visualization', '1', { 
     packages: ['corechart'] 
     }); 

     // call drawChart once google charts is loaded 
     google.setOnLoadCallback(drawChart); 

    </script> 

    </head> 
    <body> 
    <div id="chart" style="width: 100%;"></div> 
    </body> 
</html>

我希望用d3.js繪製數據，而不是使用谷歌的圖表，因爲它提供了更多的靈活性（我很驚訝需要採取多大的努力重新大小圖表使用谷歌圖表）。要做到這一點，可能需要使用d3.js JSON提取獲得來自website.I數據曾試圖根據問題1，2如下：

var data1; 
var url = "https://data.sparkfun.com/output/dZ4EVmE8yGCRGx5XRX1W.json" 

d3.json(url, function (json) { 
     if (error) return console.warn(error); 
    //data1 = json; 
    data1=json; 
    consol.log(data1) 
      //code here 
        })

沒有奏效。我可能缺少一些關鍵信息，因爲我是d3.js和java的新手。請給我一個方向，以便我可以跟隨。謝謝！

來源

2017-01-23 Chenming Zhang

哪裏是'在你的回調函數定義error'？我會刪除它，然後再試一次:-) – FriendFX

既然你試圖趕上error，你必須通過誤差在匿名函數的第一個參數：這個

d3.json(url, function (error, json) { 
    //first argument -----^ 
    if (error) return console.warn(error); 
    data1=json; 
    consol.log(data1) 
    //code here 
})

注意的是：在d3.json，「錯誤」是第一個的說法，不是第二個。

一種更簡便的方法是簡單地去掉了「錯誤」：

d3.json(url, function (json) { 
    data1=json; 
    consol.log(data1) 
    //code here 
})

來源

2017-01-23 06:48:04

使用d3繪製json數據in phant使用d3 js

回答

相關問題