2017-03-20 5 views
1

外部JsonファイルからD3読み込みを使用してテーブルを生成しようとしていますが、パラメータ "fieldNamesUnique"も関数に渡しています。関数はエラーなしで実行されますが、tbodyタグは空です。ここでtbodyタグ要素は、D3を使用して基本テーブルを生成するときに空を返します

はJSONデータである: page source

誰かがなぜTBODYを見つける私を助けてもらえ:ここ

[ 
    { 
    "Label": "External-Partner-Induced", 
    "Count": 9 
    }, 
    { 
    "Label": "Null", 
    "Count": 1 
    }, 
    { 
    "Label": "FCTS-Induced", 
    "Count": 66 
    }, 
    { 
    "Label": "EI-Partner-Induced", 
    "Count": 78 
    } 
] 

はD3コード

 function testFunction(fieldNamesUnique) { 
      data = d3.json('json/dataQualityIssuesCategory.json') 
      tabulate(data, ['Category', 'Count']); 

      } 
      function tabulate(data, columns) { 
       var table = d3.select('#response').append('table') 
       var thead = table.append('thead') 
       var tbody = table.append('tbody'); 

       // append the header row 
       thead.append('tr') 
        .selectAll('th') 
        .data(columns) 
        .enter() 
        .append('th') 
        .text(function (column) { return column; }); 

       // create a row for each object in the data 
       var rows = tbody.selectAll('tr') 
        .data(data) 
        .enter() 
        .append('tr'); 

      // create a cell in each row for each column 
      var cells = rows.selectAll('td') 
       .data(function (row) { 
        return columns.map(function (column) { 
         return {column: column, value: row[column]}; 
        }); 
        }) 
       .enter() 
       .append('td') 
       .text(function (d) { return d.value; }); 
      return table; 
     } 

そして、ここでは結果がありますタグは空ですか?

答えて

1

d3.json(技術的に言えば、要求に関連するオブジェクトを返します)。

したがって、あなたが行うことはできません。その代わりの

data = d3.json('json/dataQualityIssuesCategory.json') 

を、dataはコールバック内のパラメータである必要があります。ここでは

d3.json("dataQualityIssuesCategory.json", function(data){ 
    //parameter here -------------------------------^ 
    //code using 'data' here 
}); 

はあなたのコードとplunkerです:https://plnkr.co/edit/jJQHWSz0wvQkWFqULq7t?p=preview

PS:私はと答えていますあなたの質問("なぜtbodyタグが空ですか?")。あなたのコードは、結果によってわかるように、いくつかの問題を抱えていますが、この質問の範囲にはありません。

+0

ああ、ありがとうございます。 –

+0

これはありがとう! –