D3不會在加載外部JSON後添加元素

Question

所以我一直試圖讓我的頭在此，但不知何故D3不會將g元素附加到SVG。

我創建了一個函數totalpoints，並在我希望它添加SVG的元素後調用它。這一切工作正常，但它不會任何元素追加到SVG ..

var chart = d3.select(id) 
     .append("svg") //append svg element inside #chart 
     .attr("width", width + margin.left + margin.right) //set width 
     .attr("height", height + margin.top + margin.bottom); //set height 

    d3.json("https://dl.dropboxusercontent.com//s/339pul17xrdsk6w/data.json?raw=1", function(error, data) { 

     var bar = chart.selectAll("g") 
      .append("g") //append svg element inside #chart 
      .attr("width", width + margin.left + margin.right) 
      .attr("height", height + margin.top + margin.bottom); 
    }); 

這裏是一個JSFiddle。

Answer 1

問題很簡單。原來的JSON是

{"section":"Totale punten voor","points":"1791"} 

什麼工作是把它周圍[]，像

[{"section":"Totale punten voor","points":"1791"}] 

出現g元素。

Answer 2

有（至少）兩個問題：

無數據

在你d3.json，你不使用的加載data任何地方。

你應該是這樣的：通過匹配與顯示數據的視覺元素

var bar = chart.selectAll("g") 
    .data(data) 
    .enter() 
    ... 

d3作品，並從它的角度來看，你沒有給它的任何。

只有族元素

唯一添加的元素是CSS的基團。他們本身不顯示任何東西。