我是D3世界的新手。在尝试将此example转换为水平分组的条形图时,我遇到了一个复杂的情况。我正在遵循this post中描述的转换点。这是我的code版本。
我已经转换了水平组图表的所有域和范围,但无法成功。
var xScale = d3.scale.linear().range([innerHeight, 0]);
var yScale = d3.scale.ordinal().rangeBands([innerWidth, 0], barPadding);
bars.attr("y", function(d, i, j) {
return yScale(d[yColumn]) + barWidth * j;
})
.attr("x", 0)
.attr("height", barWidth)
.attr("width", function(d) {
return xScale(d.y);
})
非常感谢任何帮助!
答案 0 :(得分:1)
这种转换比你最初想象的要复杂一点。在您分享的代码段中,yScale范围为var result = from c in Courses...
i cant figured out here
select new{
videoCount = [number of video releated to course],
fileCount = [number of file releated to course],
};
时应为[innerWidth, 0]
。以下是相关部分。您可以看到它正在运行here。
请注意,我使用stack的布局d.x作为y轴的输入,d.y作为x轴的输入。那是因为d3.layout.stack没有方向作为参数。
[0, innerHeight]