我目前正在研究crossfilter示例,以便利用股票股票的数据制作有趣的基准。 下面是tsv文件中的数据示例。
symbol quarter grossprofit totalrevenue ebitda sector
ABI.BR Q1 7273000000 12239000000 3858000000 Ind
ABA.BR Q2 7334000000 12201000000 3817000000 Ind
AA.BR Q3 6318000000 10605000000 3097000000 Serv
A.BR Q4 7229000000 11711000000 4185000000 Serv
ADC.PA Q1 188000000 1297000000 110000000 Agri
SD.PA Q2 188000000 1297000000 110000000 Agri
SQ.PA Q3 247000000 1421000000 169000000 Customer
AC.PA Q4 247000000 1421000000 169000000 Customer
GF.PA Q1 3432000000 3432000000 671000000 Ind
RF.PA Q2 3400000000 3400000000 631000000 Ind
ER.PA Q3 3422000000 3422000000 713000000 Agri
TG.PA Q4 3239000000 3239000000 349000000 Agri
这个想法是创建每个扇区的ebitda的平均值,无论季度或符号如何,并以条形图显示结果。
下面是我使用的交叉滤波器代码:
var ndx = crossfilter(mydata);
var all = ndx.groupAll();
var SectorDim = ndx.dimension(function (d) { return d.sector; });
var SectorDimGroup = SectorDim.group().reduce(
//add
function(p,v){
p.count++;
p.sec = v.sector;
p.sum += v['totalrevenue']/100000000;
p.avg = d3.round((p.sum/p.count),2);
return p;
},
//remove
function(p,v){
p.count--;
p.sec = v.sector;
p.sum -= v['totalrevenue']/100000000;
p.avg = d3.round((p.sum/p.count),2);
return p;
},
//init
function(p,v){
return {count:0, sec:0, avg:0, sum:0};
}
);
var result = SectorDimGroup.top(Infinity);
console.log("result variable");
console.log(result);
var minD = SectorDim.bottom(1)[0].sector;
console.log(minD);
var maxD = SectorDim.top(1)[0].sector;
console.log(maxD);
var mychart = dc.barChart("dc-bar-chart");
mychart.width(420)
.height(250)
.margins({top: 10, right: 50, bottom: 30, left: 40})
.dimension(SectorDim)
.group(SectorDimGroup)
.valueAccessor(function (p) {
return p.value.avg;
})
// .brushOn(false)
// .elasticY(true)
.x(d3.scale.ordinal())
.xUnits(dc.units.ordinal);
从crossfilter的分组中我得到一个像{key:Serv,value {avg:123,sum:3456}}
的对象我试图在x轴上显示行业部门(Serv,Agri,...),并在y轴上显示每个部门的平均值(p.value.avg)。
不幸的是,它根本不起作用。
1 /你有什么线索吗? 2 /第二步将按季度分组并进行相同的练习,如果您有任何方法可以管理双重"分组"这会很棒 ?答案 0 :(得分:0)
您只是向图表构造函数提供了无效的选择器
使用#
对它们进行前缀似乎可以解决问题:
var mychart = dc.barChart("#dc-bar-chart");
var V1Chart = dc.rowChart("#dc2");
http://jsfiddle.net/1hmb09e7/3/
(我还将javascript库指向公共CDN,因为它看起来像原始服务器还没有工作。)
如果dc.js指出它正在尝试在void中创建元素,那么would be nice。
您下次也可以尝试最小化您的示例,因为这与您认为的问题无关。 ; - )