如何计算数据最大值？d3.max获取错误最大值的解决方法

嘿，这个问题我之前也碰到过！你现在得到错误结果的核心原因是你的value属性都是字符串类型，而D3的max函数默认会按照字符串的字典序来做比较，不是我们直觉里的数值大小比较。

举个例子，字符串"60"和"8"对比时，JavaScript会从第一个字符开始比："6"的ASCII码是54，"8"是56，所以"8"会被判定为更大的那个，这就是为什么你拿到的最大值是8而不是60。

给你两个简单的解决方案：

方案一：在访问器函数中转换为数值 #

直接在d3.max的回调里把字符串转成数值类型，用parseInt或者Number()都可以：

console.log(d3.max(data, (d) => { return parseInt(d.value, 10); }));

或者更简洁的写法：

console.log(d3.max(data, d => Number(d.value)));

方案二：提前预处理数据 #

如果后续还要多次用到这些数值，可以先把整个数据里的value都转成数值，之后再用d3.max就不用每次转换了：

// 预处理数据，把value转成数值
const processedData = data.map(item => ({
  ...item,
  value: Number(item.value)
}));
// 现在直接取最大值就没问题了
console.log(d3.max(processedData, d => d.value));

这两种方法都能让你得到正确的最大值60，选哪种看你的实际需求就行～

内容的提问来源于stack exchange，提问作者ram