Как читать в CSV с d3 v4?

У меня просто небольшие проблемы с пониманием документации для CSV Parse с D3. У меня сейчас есть:

d3.parse("data.csv",function(data){
    salesData = data; 
});

Но я продолжаю получать ошибку:

Uncaught TypeError: d3.parse не является функцией

Как это должно выглядеть? Я просто немного запутался, и единственные примеры, которые я мог бы найти что - то вроде этого.

Я также попробовал что-то вроде:

d3.dsv.parse("data.csv",function(data){
    salesData = data; 
});

и получил:

Uncaught TypeError: Невозможно прочитать свойство 'parse' из неопределенного

Почему это происходит? Любая помощь будет очень признательна, спасибо!

Ответы

Ответ 1

Здесь есть некоторое недопонимание: вы путаете d3.csv, который является запросом, с d3.csvParse, который анализирует строку (а также смешивает синтаксис D3 v3 с синтаксисом D3 v4). В этом разница:

d3.csv(D3 v4)

Функция d3.csv, которая принимает в качестве аргументов (url[[, row], callback]):

Возвращает новый запрос для CSV файла по указанному URL-адресу с типом mime по умолчанию text/csv. (выделение мое)

Итак, как видите, вы используете d3.csv, когда хотите запросить данный CSV файл по указанному URL-адресу.

Например, приведенный ниже фрагмент получает CSV по URL между кавычками, который выглядит следующим образом...

name, parent
Level 2: A, Top Level
Top Level, null
Son of A, Level 2: A
Daughter of A, Level 2: A
Level 2: B, Top Level

... и регистрирует проанализированный CSV файл, проверьте его:

d3.csv("https://gist.githubusercontent.com/d3noob/fa0f16e271cb191ae85f/raw/bf896176236341f56a55b36c8fc40e32c73051ad/treedata.csv", function(data){
    console.log(data);
});

<script src="https://d3js.org/d3.v4.min.js"></script>

Ответ 2

Вы можете получить данные csv в d3, как показано ниже:

// get the data
d3.csv("data.csv", function(error, data) {
  if (error) throw error;
      console.log(data);
      //format data if required...
      //draw chart
}

Ответ 3

Используйте d3.csv("data.csv", function(data){...}), чтобы получить CSV из url и parse, или используйте d3.csv.parse() для разбора строки в формате CSV.

Ответ 4

Вот код, который вы можете использовать для чтения csv файла с помощью d3.js

<script src="https://d3js.org/d3.v4.min.js"></script>
<script>
 d3.csv("csv/cars.csv", function(data) {
 console.log(data[0]);
});
</script>

Обратите внимание, что имя файла csv - "cars.csv", и файл сохраняется в папке csv.

console.log(data[0])

поможет вам увидеть вывод данных в окне отладки браузера. Где вы также можете найти, есть ли какая-либо ошибка.

Ответ 5

Я также не смог заставить работать d3.csv("csv_file.csv", функция (data) {//изменение кода}).

Одноклассник рекомендовал использовать следующее, которое до сих пор работало:

d3.csv("data.csv").then(function(data){
//modifying code
}

Как отмечено в комментариях ниже, это исправление, если вы используете v5 вместо v4.