使用d3 v3.js通過更改輸入選擇中的數據過濾堆疊條形圖

我是D3新手，並創建了堆疊條形圖，如http://www.adeveloperdiary.com/d3-js/create-stacked-bar-chart-using-d3-js/。使用d3 v3.js通過更改輸入選擇中的數據過濾堆疊條形圖

假設我用CSV像

month,A,B 
Jan,10,20 
Feb,30,40

我需要添加過濾器使得當輸入爲A，只有A的數據矩形應該是visible.Please幫我上如何可以實現的。我添加使用var輸入=「A」，並增加方法的具體方法如下

var dd=function(x) 
{ 
    if(input==null) 
    { 
     return direction.map(function (c) { 

    return data.map(function (d) { 

     //console.log(d[c]); 
      return {x: d.month, y: d[c]}; 
     })  
    }) 
    } 

     else{ 
      return data.map(function (d) { 
       return {x: d.month , y : d[input]}; 
      }); 
     } 

} 
var dataIntermediate=dd(input); 
console.log(JSON.stringify(dataIntermediate));

這是能夠取x和y特定於每個輸入，但是，當我將其添加到

var dataStackLayout = d3.layout.stack()(dataintermediate);

我得到t.map不是一個函數。當它是特定的月份，只是一個輸入設置value.Flaw的是在這段代碼

var dataStackLayout = d3.layout.stack()(dataIntermediate); 

x.domain(dataStackLayout[0].map(function (d) { 
    return d.x; 
})); 

y.domain([0, 
    d3.max(dataStackLayout[dataStackLayout.length - 1], 
      function (d) { return d.y0 + d.y;}) 
    ]) 
    .nice();

與此同時，所有數據可見之初，只有選擇後，要過濾的視覺需求。我被卡住了。請支持

來源

2016-12-10 Gayathri

只需要做一個修改即可。

var dataStackLayout = d3.layout.stack()([dataIntermediate]);

這是服務的目的。就是這樣。

來源

2016-12-10 10:14:27 Gayathri

使用d3 v3.js通過更改輸入選擇中的數據過濾堆疊條形圖

回答

相關問題