我正在使用 D3,我该如何纠正 "t is not iterable error"?

I'm using D3, how do I rectify "t is not iterable error"?

我在 D3 中收到以下错误:TypeError: t is not iterable at Object.H [as min]

我修改的代码来自 v3,但我认为我已将所有内容更改为 v7。

我相信我已经找到导致错误的原因,但我不知道为什么会发生错误以及如何解决它。这就是我认为问题的来源,因为当我将两个域行中的代码更改为 .domain([0,1]) 时,问题就消失了。

  var xScale = d3.scaleLinear()
    .domain([
        d3.min([0,d3.min(data,function (d) { return d.AvgPerc; })]),
        d3.max([0,d3.max(data,function (d) { return d.AvgPerc; })])
        ])
    .range([0,w])
  var yScale = d3.scaleLinear()
    .domain([
        d3.min([0,d3.min(data,function (d) { return d.ActualPerc; })]),
        d3.max([0,d3.max(data,function (d) { return d.ActualPerc; })])
        ])
    .range([h,0])

这里是完整的参考代码,以备不时之需(我也有 xAxis 和 yAxis 变量的错误,但一次一步!):


  // Variables
  var body = d3.select('.d3block')
    var margin = { top: 50, right: 50, bottom: 50, left: 50 }
    var h = 500 - margin.top - margin.bottom
    var w = 600 - margin.left - margin.right
    var formatDecimal = d3.format('.2')
    // Scales
  var xScale = d3.scaleLinear()
    .domain([
        d3.min([0,d3.min(data,function (d) { return d.AvgPerc; })]),
        d3.max([0,d3.max(data,function (d) { return d.AvgPerc; })])
        ])
    .range([0,w])
  var yScale = d3.scaleLinear()
    .domain([
        d3.min([0,d3.min(data,function (d) { return d.ActualPerc; })]),
        d3.max([0,d3.max(data,function (d) { return d.ActualPerc; })])
        ])
    .range([h,0])
    // SVG
    var svg = body.append('svg')
        .attr('height',h + margin.top + margin.bottom)
        .attr('width',w + margin.left + margin.right)
      .append('g')
        .attr('transform','translate(' + margin.left + ',' + margin.top + ')')
    // X-axis
    var xAxis = d3.svg.axis()
      .scale(xScale)
      .tickFormat(formatDecimal)
      .ticks(5)
      .orient('bottom')
  // Y-axis
    var yAxis = d3.svg.axis()
      .scale(yScale)
      .tickFormat(formatDecimal)
      .ticks(5)
      .orient('left')
  // Circles
  var circles = svg.selectAll('circle')
      .data(data)
      .enter()
    .append('circle')
      .attr('cx',function (d) { return xScale(d.AvgPerc) })
      .attr('cy',function (d) { return yScale(d.ActualPerc) })
      .attr('r','10')
      .attr('stroke','black')
      .attr('stroke-width',1)
      .attr('fill', 'rgb(139,71,38)')

所以问题是双重的,原始代码和 ksp 的初始响应(简化为 d3.max(data,function (d) { return d.ActualPerc; }))都可以工作。

两个问题是:

  1. 我的代码的第一行我省略了而且不应该省略的是不正确的,我使用了 d3.csv('data.csv', function(data) {...}) 而我应该使用 d3.csv('data.csv').then(function(data) {...})
  2. d3.svg.axis 无效,必须更改为 d3.axisBottom 并删除 .orient(bottom)

感谢@ksp585 对轴域的原始帮助,解释澄清了事情!