Uso la función d3.CSV() y funciona. Sin embargo, ¡da un error en blanco! Tengo que resolver este problema, ya que puede causar complicaciones más adelante.

Archivo CSV:

 Food,Rating Pizza,90 Ice Cream,92 Spaghetti,85 Tuna Salad,75

Guion:

 <script> d3.csv("food.csv", function(error,data) { if (error) { console.log("error messages: ", error) } else { console.log(data) } }) </script>

Producción:

 test.html:17 error messages: {Food: 'Pizza', Rating: '90'} test.html:17 error messages: {Food: 'Ice Cream', Rating: '92'} test.html:17 error messages: {Food: 'Spaghetti', Rating: '85'} test.html:17 error messages: {Food: 'Tuna Salad', Rating: '75'}

La línea 17 en el archivo HTML es:

 console.log("error messages: ", error)

Actualización 15 de agosto de 2022

Versión D3.js: obtuve este enlace del sitio web D3.js

 https://d3js.org/d3.v7.min.js

Basado en la sugerencia de Dan, probé el siguiente bloque de código:

 d3.csv("food.csv").then(data => { console.log(data) }).catch(error => { console.error(error) })

Obtengo resultados sin ningún mensaje de error. Ahora, quiero inducir un error para verificar el informe de errores, cambio food.csv a food1.csv. No obtengo resultados, pero no hay ningún mensaje de error. Obtengo todos los elementos HTML enumerados en la consola como la salida del código antiguo.

Probé el siguiente código con el nombre incorrecto para el archivo CSV para inducir un error y ver si podía obtener algún mensaje de error:

 d3.csv("food1.csv").then(data => { console.log(data) }).catch(error => { console.log("There is an error: ",error) })

Igual que el código antiguo, en lugar de un mensaje de error, obtengo todos los elementos HTML de la página en una matriz como salida en la consola.

¿Cómo podemos obtener un mensaje de error decente de d3.csv()?