D3.js 从数组数组中选择最小值/最大值（嵌套 d3.extent）答案

【问题标题】：D3.js Selecting min/max value from an array of arrays (nesting d3.extent)D3.js 从数组数组中选择最小值/最大值（嵌套 d3.extent）
【发布时间】：2014-03-12 18:43:27
【问题描述】：

我有一段代码可以获取列中元素的值并将它们放入数组中：

var someArray = new Array(rows.selectAll("td").filter(function(d,i)
    {
        if(i==2) //index of the cells in the rows where I retrieve the data  
        {
            return (d3.select(this))
        }
    }));

^ 创建一个 array[1]s 数组，其中包含元素中单元格的值，例如“2.6”或“5.4”

当我尝试使用时：

console.log(d3.min(someArray));

我得到 [Array[1], Array[1], Array[1],...] 而我需要返回的是这些数组中的最小值，然后是最大值（这将用于 d3.scale .linear().domain([最小值,最大值])

【问题讨论】：

标签： javascript arrays d3.js

【解决方案1】：

在我的情况下，我有一个数组数组，我使用了一些不同的方式来混合Cool Blue 解决方案。我的数据是这样的

[[{
  "timestamp": 44299.46625605324,
  "dateTime": "2021-04-13T11:11:24.5237792Z",
  "value": 9.92,
  "status": 0
},
{
  "timestamp": 44299.466267627315,
  "dateTime": "2021-04-13T11:11:25.5237792Z",
  "value": 3.92,
  "status": 0
},],[{
  "timestamp": 44299.46625605324,
  "dateTime": "2021-04-13T11:11:24.5237792Z",
  "value": 9.92,
  "status": 0
},
{
  "timestamp": 44299.466267627315,
  "dateTime": "2021-04-13T11:11:25.5237792Z",
  "value": 3.92,
  "status": 0
},]]

我尝试在 x 轴上使用时间刻度并使用 dateTime 属性来获取刻度域。

d3.extent(data.reduce(function(m,d){
                            return m.concat(d3.extent(d, d => new Date(d.dateTime).valueOf()))
                        },[]))

【讨论】：

【解决方案2】：

这是基于@Johnny 对我们这些没有幸使用 ES6 的人的回答：

function nestedExtent(data, accessor) {

  return data.reduce( function ( prevArr, currArr) {
    var extentArr = d3.extent([currArr], accessor);

    return [
      Math.min(prevArr[0], extentArr[0]),
      Math.max(prevArr[1], extentArr[1])
    ];

  }, [Infinity, -Infinity] );
}

例子：

var mydata = [4, 6, -2, 42, 17];

nestedExtent( mydata , function(d) { return d; });

【讨论】：

【解决方案3】：

对于d3.extend 的嵌套版本，一点点 ES6 优点和accessor 的可能性，您可以使用以下内容：

function nestedExtent(data, accessor) {
  return data.reduce(([extentMin, extentMax], d) => {
    const [min, max] = extent(d, accessor);

    return [
      Math.min(extentMin, min),
      Math.max(extentMax, max),
    ];
  }, [Infinity, -Infinity]);
}

【讨论】：

【解决方案4】：

我正在寻找一种方法来嵌套d3.extent，但我找不到，所以我自己想办法，这就是我想出的...

var extent = d3.extent(arrayOfArrays.reduce(function(m,d){return m.concat(d)},[]))

【讨论】：

【解决方案5】：

你只需要嵌套调用：

var min = d3.min(arrayOfArrays, function(d) { return d3.min(d); });

~~要同时获取最大值和最小值，请使用d3.extent():~~

// extent[0] == min, extent[1] == max
var extent = d3.extent(arrayOfArrays, function(d) { return d3.extent(d); });

不幸的是，您无法在嵌套情况下获得范围 - 您必须分别执行 min 和 max。

【讨论】：

当我尝试console.log(d3.extent(arrayOfArrays, function(d){return d3.extent(d); })); 时，它返回 [Array[2], Array[2]]，每个都包含相同的数据（在本例中为“2.6”，最低值
哦，对不起，你说得对，这实际上在嵌套情况下不起作用。我会更新答案。