我正在阅读《Web 交互式数据可视化》一书自学如何使用 D3（使用 D3 的第 5 版），但我无法理解我做错了什么，这是第 76 页。
有一个非常简单的 .csv 文件 (food.csv)，其中包含两列，一列标题为“食物”，另一列标题为“美味”。我使用以下代码将文件加载到 D3 中：
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset="utf-8">
<title>Loading csv File</title>
<script type="text/javascript" src="d3.js"></script>
</head>
<body>
<script type="text/javascript">
d3.csv("food.csv",function(data){
console.log(data);
});
</script>
</body>
</html>
由于 Deliciousness 值作为字符串加载，因此本书定义了一个将字符串转换为浮点数的函数，以下是其代码：
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset="utf-8">
<title>Loading Data and Converting Data Type</title>
<script type="text/javascript" src="d3.js"></script>
</head>
<body>
<script type="text/javascript">
var rowConverter = function(d){
return {
Food: d.Food,
Deliciousness: parseFloat(d.Deliciousness)
};
}
d3.csv("food.csv", rowConverter, function(data){
console.log(data);
});
</script>
</body>
</html>
当我这样做时，美味值的数据类型没有改变。我错过了一些非常简单的事情吗？
我查看了 parseFloat 的文档，这似乎不是问题。我想知道我是否只是误解了 rowConverter 函数应该在哪里定义。
我没有太多的 html 或 JavaScript 编码经验，所以这可能是问题所在。
d3 使用 fetch 所以正确的语法是：
var rowConverter = function (d) {
return {
Food: d.Food,
Deliciousness: parseFloat(d.Deliciousness),
};
};
d3.csv('food.csv', rowConverter).then((d) => {
console.log(d);
});