使用dc.jc在气泡图中不显示气泡

Question

我正在使用dc.js，crossfilter.js制作气泡图，但气泡未显示在图表中！它只是显示x轴和y轴，但气泡消失了。

我在click to see

尝试制作此气泡图

这是我的代码：

var dateDim = ndx.dimension(function(d) {return d.Date;});
  var minDate = dateDim.bottom(1)[0].Date;
  var maxDate = dateDim.top(1)[0].Date;
  console.log(minDate);
  console.log(maxDate);
  //var ageDim = ndx.dimension(function(d){return +d.Age;});
  var daySum = dateDim.group().reduceSum(function(d){return 1;});


  //print_filter("ageSum");
 // var hits = dateDim.group().reduceSum(function(d) {return d.Age;});
  var brush = d3.svg.brush();



  suicideBubbleChart
    .width(990).height(200)
    .transitionDuration(1500)
    .dimension(dateDim)
    .group(daySum)
     .colors(d3.scale.category10())

.x(d3.time.scale().domain([minDate,maxDate]))
.y(d3.time.scale().domain([minDate,maxDate]))
.r(d3.scale.linear().domain([0, 4000]))
.minRadiusWithLabel(15)
.yAxisLabel("Suicides")
.elasticY(true)
                .yAxisPadding(100)
                .elasticX(true)
                .xAxisPadding(200)
                .maxBubbleRelativeSize(0.07)
                .renderHorizontalGridLines(true)
                .renderVerticalGridLines(true)
                .renderLabel(true)
                .renderTitle(true);

谢谢。

Answer 1

我已经足够修复以开始在图表上显示内容。

在Date之前有一个空格导致该字段名出错，并且日期格式错误，我添加了一个radiusValueAccessor。

var dateFormat = d3.time.format('%m/%d/%Y');

...

  .r(d3.scale.linear().domain([0, 10]))
  .radiusValueAccessor(function(d) {
      return d.value;
  })

http://jsfiddle.net/gordonwoodhull/wjeonreq/15/

显然它仍然不是你想要的图表，但希望现在你有一些东西出现在屏幕上，你可以开始塑造和调试它。

特别是，您需要一个valueAccessor才能将气泡放在Y和Y刻度中。

这是关于dc＆amp; amp;的令人沮丧的事情之一d3如果某些东西不起作用，那么你只需得到一张空图表。我在处理控制台中出现的上述错误后跟踪此问题的方式是

1. 查看daySum.all（）以确保数据正常（在更正日期之后）
2. 检查Developer工具的Elements选项卡中的svg元素。里面的g.chart-body有实际内容。我看到气泡在那里，但半径为零。然后我回头查看了库存示例，看看必须缺少什么半径设置。