想用长度(从d3.nest)作为半径

时间:2016-05-26 19:09:28

标签: d3.js

我对使用以下结果有心理障碍:

    .rollup(function(leaves) { return leaves.length;})

作为散点图中圆的半径。我的完整代码(和示例数据)在这里https://plnkr.co/edit/Cwuce6inLV5jouCWTFfN

散布的静态值为5,但我想根据d3.nest中的.rollup使用值,正如我在其他SO问题中所解释的那样:Capturing leaves.length value from d3.nest

我认为我在这部分代码中缺少一个关键概念:

d3.tsv("etds_small.tsv", function(error, dataset) {
  dataset.forEach(function(d) {
    if(deptlist.indexOf(d.dept) == -1) deptlist.push(d.dept);
    if(years.indexOf(d.year) == -1) years.push(d.year);
  })

  var deptYearCount = d3.nest()
    //.key(function(d) { return d.college;} )
    .key(function(d) { return d.dept})
    .key(function(d) { return d.year })
    .rollup(function(leaves) { return leaves.length;})
        .map(dataset);

        console.log(dataset);   // retains the college, dept, and year labels
        console.log(deptYearCount);  // replaces labels with "key"

  x.domain(years.sort(d3.ascending));
  y.domain(deptlist.sort(d3.ascending));
  //console.log(y.domain());
  //console.log(x.domain());

    svg.selectAll(".dot")
          .data(dataset)  //should this be deptYearCount from the d3.nest above?
        .enter().append("circle")
          .attr("class", "dot")
          .attr("r", 5)  // Would like to use length (from d3.nest) as radius
          //.attr("r", function(d) {return d.values.length*1.5;}) works with .data(debtYearCount)
          .style("opacity", 0.3)
          .style("fill", "#e31a1c" )
          .attr("cx", function(d) {
            return x(d.year);
          })
          .attr("cy", function(d) {
            return y(d.dept);
          });

1 个答案:

答案 0 :(得分:2)

尝试半径:

.attr("r", function(d) {return Object.keys(deptYearCount[d.dept]).length*1.5;})

因为您使用的是.map(dataset)而不是.entries(dataset),所以d3.next()返回的是一个大对象而不是一个对象数组。该one-big-object不包含名为values的属性。

更新说明:

首先,查看对象deptYearCount的结构。它具有Earth Sciences.Education.等属性名称。

我们的d3数据正在迭代一组对象。每个对象的属性dept看起来都像Earth Sciences.Education.等。

因此,deptYearCount[d.dept]让我们找到deptYearCount内的正确属性。

例如,在我们迭代的一轮中,我们正在查看deptYearCount["Education."]。结果是另一个具有20072008等属性的对象。因此,deptYearCount["Education."]中的属性数是我们想要的半径值。

我们如何找到deptYearCount["Education."]的属性数量?一种方法是Object.keys(someObject)功能。它返回一个与属性名称相对应的字符串数组,我们只需要它.length