ReactJS / Javascript: функция карты и JSON - PullRequest
Новая
       9

ReactJS / Javascript: функция карты и JSON

0 голосов
/ 25 августа 2018

enter image description here В консоли данные загружаются в файл JSON, который я пытаюсь отобразить (см. Ниже).Сообщение об ошибке от Chrome: TypeError: data.map is not a function.Я не нашел хороших примеров функции d3.extent, поэтому здесь я ищу некоторую помощь с этим.Компонент Graph выглядит следующим образом: 

constructor({data=[]}) {
  console.log('construc data:', data)
    const times = d3.extent(data.map(action => action.timestamp))
    const range = [50, 450]
    super({data})
    this.state = {data, times, range}
}

Файл JSON: 

{data: 
     action: 
        {action: [{action: "Changed", timestamp: 1499348050,…},…]}

1 Ответ

0 голосов
/ 25 августа 2018

Неверный JSON

Ваш файл JSON недействителен, поскольку ваши ключи должны быть заключены в кавычки.Используйте JSON Validator , чтобы убедиться, что у вас есть правильный файл JSON.

Вызов .map() на Object вызывает TypeError

Когда ваши данные загружаются из файла JSON (и по умолчанию это не пустой массив, заданный вашим конструктором), убедитесь, что он имеет форму Array, потому что вызов метода .map() дляObject вместо Array вызывает TypeError.Это связано с тем, что .map() является частью прототипа Array, а d3.extent(array) требует Array в качестве аргумента.

Подробнее о * 1031 в JavaScript*Array

Подробнее о JavaScript Object

Правильный подход

Если ваш JSON правильно загружен в объект data, должно работать следующее: 

d3.extent(data.action.action.map(action => action.timestamp))
...