2014-02-12 34 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