2014-02-12 63 views
0

我有多個數據集傳遞給NVD3 multiBarChart。問題是,如果圖表似乎無法在堆疊模式下正確顯示如果某組屬性缺少一組屬性。帶有非標準化數據的NVD3 MultiBarChart堆疊顯示

比方說,我有用戶每週喝喜好列表:

[ 
    { 
     userName: "Todd", 
     values: [ 
      { 
       x: "Coffee", 
       y: 32 
      }, 
      { 
       x: "Tea", 
       y: 13 
      }, 
      { 
       x: "Beer", 
       y: 2 
      } 
     ] 
    }, 
    { 
     userName: "Allison", 
     values: [ 
      { 
       x: "Coffee", 
       y: 4 
      }, 
      { 
       x: "Milk", 
       y: 2 
      }, 
      { 
       x: "Sprite", 
       y: 14 
      } 
     ] 
    }, 
    { 
     userName: "Vern", 
     values: [ 
      { 
       x: "Water", 
       y: 112 
      }, 
      { 
       x: "Gatorade", 
       y: 13 
      }, 
      { 
       x: "Beer", 
       y: 0 
      } 
     ] 
    } 
] 

因爲不是所有的「用戶」具有相同的飲料,圖表不會在堆棧模式正確顯示。

如果我對數據進行規範化處理,以便每個用戶都擁有相同的飲料,而以前缺失的值將得到0值,堆疊模式將正確顯示。

我正在尋找一種以編程方式標準化數據的方式,以便所有「用戶」數組都具有相同的對象數。

這是類似於這裏的帖子:in nvd3 multibarchart, some stacks lose their colors or otherwise become invisible,但是,我正在尋找一種以編程方式標準化數據的方式。

回答

1

這不是做最有效的方式,但不使用任何庫,並應工作的優良不太大量的數據:

var drinks = []; 
data.forEach(function(d) { 
    d.values.forEach(function(e) { 
    if(drinks.indexOf(e.x) == -1) drinks.push(e.x);; 
    }); 
}); 

data.forEach(function(d) { 
    drinks.forEach(function(drink) { 
    var have = false; 
    d.values.forEach(function(e) { 
     if(e.x == drink) have = true; 
    }); 
    if(!have) d.values.push({x: drink, y: 0}); 
    }); 
}); 

完成演示here