Question

我的初始数组包含构建盒子图所需的季度数据，由ProspRating面对。我根据第一季度数据创建了许多复杂的g对象（每个ProspRating一个）。每个g包含简单的boxplot元素 - 线条，矩形等。）

要创建对象，我使用了以下代码（仅摘录一个简单的boxplot元素（line.range））：

d3.select("svg").selectAll("g.box")
.data(data10Q1)
.enter()
.append("g")
.attr("class", "box")
.attr("transform", function(d) {return "translate(" + xScale(d.ProspRating) +"," + yScale(d.v_mdn) + ")"})
.each(function(d,i) {

d3.select(this)
.append('line')
.attr("class", "range")
.attr("x1", 0)
.attr("x2", 0)
.attr("y1", yScale(d.v_max) - yScale(d.v_mdn))
.attr("y2", yScale(d.v_min) - yScale(d.v_mdn))
.style("stroke", "black")
.style("stroke-width", "4px");

基于代码的初始箱图效果很好。目前我正在尝试编写一个函数来根据另一个季度的数据更新元素属性。

摘自代码（仅适用于一个boxplot＆＃39; s元素（line.range））：

function update (quarter) {
var filtered = data.filter(function(d) {
  return d.quarter === quarter})


var boxes = d3.select("svg").selectAll("g.box")
 .data(filtered, function(d){return d.ProspRating})
  .attr("transform", function(d) {return "translate(" + xScale(d.ProspRating) +"," + yScale(d.v_mdn) + ")"})
  .each(function(d,i) {

    d3.select(this)
    .select("line.range")
    .attr("y1", yScale(d.v_max) - yScale(d.v_mdn))
    .attr("y2", yScale(d.v_min) - yScale(d.v_mdn))

看起来像d3.select（this）.select（＆＃34; line.range＆＃34;）无法正常工作。访问line.range和其他类似元素以更新其属性的最佳方法是什么？

Answer 1

我猜你错过了.enter()

之后的var boxes = d3.select [...] .data [...]

选择＆＃34;这个＆＃34;的子元素更新属性

1 个答案: