我试图将内核密度估计的示例从https://github.com/jasondavies/science.js/tree/master/examples/kde修改为只有1行而不是2行。为此,我需要修改以下代码。更具体地说,我需要修改.data(d3.values(science.stats.bandwidth))
。从Chrome开发者工具中,我可以看到var bw = d3.values(science.stats.bandwidth)
返回的变量如下:
bw: Array[2]
0: function (x) {
1: function (x) {
length: 2
__proto__: Array[0]
我尝试索引到该变量,但是返回的函数无法用于绘图。变为
undefined
。var granularity = 0.1;
var x_min = 30;
var x_max = 110;
d3.json("faithful.json", function(faithful) {
data = faithful;
var w = 800,
h = 400,
x = d3.scale.linear().domain([30, 110]).range([0, w]);
bins = d3.layout.histogram().frequency(false).bins(x.ticks(60))(data),
max = d3.max(bins, function(d) { return d.y; }),
y = d3.scale.linear().domain([0, .1]).range([0, h]),
kde = science.stats.kde().sample(data);
var vis = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
var bars = vis.selectAll("g.bar")
.data(bins)
.enter().append("g")
.attr("class", "bar")
.attr("transform", function(d, i) {
return "translate(" + x(d.x) + "," + (h - y(d.y)) + ")";
});
bars.append("rect")
.attr("fill", "steelblue")
.attr("width", function(d) { return x(d.dx + 30) - 1; })
.attr("height", function(d) { return y(d.y); });
var line = d3.svg.line()
.x(function(d) { return x(d[0]); })
.y(function(d) { return h - y(d[1]); });
var bw = d3.values(science.stats.bandwidth);
vis.selectAll("path")
/* .data(d3.values(science.stats.bandwidth)) */
.data(bw[1])
.enter().append("path")
.attr("d", function(h) {
return line(kde.bandwidth(h)(d3.range(x_min, x_max, granularity)));
});
});
最佳答案
.data()
需要一个array。采用:
.data([bw[1]])
示例here。