带序号的 d3JS 直方图
d3JS Histogram with ordinal scale
我正在尝试获取使用序数标度的 D3JS 直方图(在本例中,学生成绩符号 (A+、A、B ... F))。
这是一个最小的工作示例:
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
var studentSymbols = ["F", "E", "D", "C", "C", "C", "C", "B", "B", "A", "A+"];
var x = d3.scale.ordinal()
.domain(["F", "E", "D", "C", "B", "A", "A+"])
.rangeRoundBands([0, width]);
// Generate a histogram using twenty uniformly-spaced bins.
var myHistogram = d3.layout.histogram()
(studentSymbols);
console.log(myHistogram)
</script>
</body>
当上面是运行时,控制台输出一个Array of 5 Arrays,dx和x字段等于NaN。
我应该如何更正此代码?
我想我可能已经明白了。我将 myHistogram 的声明更改为:
var myHistogram = d3.layout.histogram()
(studentSymbols.map(x));
我正在尝试获取使用序数标度的 D3JS 直方图(在本例中,学生成绩符号 (A+、A、B ... F))。
这是一个最小的工作示例:
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
var studentSymbols = ["F", "E", "D", "C", "C", "C", "C", "B", "B", "A", "A+"];
var x = d3.scale.ordinal()
.domain(["F", "E", "D", "C", "B", "A", "A+"])
.rangeRoundBands([0, width]);
// Generate a histogram using twenty uniformly-spaced bins.
var myHistogram = d3.layout.histogram()
(studentSymbols);
console.log(myHistogram)
</script>
</body>
当上面是运行时,控制台输出一个Array of 5 Arrays,dx和x字段等于NaN。
我应该如何更正此代码?
我想我可能已经明白了。我将 myHistogram 的声明更改为:
var myHistogram = d3.layout.histogram()
(studentSymbols.map(x));