Динамически создавать радиолокационные карты в ReactJS

1

У меня есть и конечная точка, в которой я уже правильно получаю свои данные, мой вопрос связан с тем, что мне нужно отформатировать мои данные, чтобы я мог отображать их в радар-диаграмме.

Формат радиолокационных данных выглядит следующим образом:

[ { rating: "rating_field", dataA: data_value, dataB: data_value }...];

Но мои данные структурированы так:

reviews: [ {average_rating: 6.3,safety_rating: 6.3,comfort_rating: 7.1 ...} ]

Итак, я подумал о том, чтобы сделать некоторые манипуляции с помощью forEachs и карт, чтобы я мог форматировать эти данные и в итоге получил что-то вроде первого примера, просто чтобы быть ясным, у меня есть множество обзоров, и каждый обзор будет рассматриваться как dataA или dataB (или C...) в структуре данных радарной диаграммы.

Итак, у кого-то есть лучшая идея или я должен придерживаться forEachs и карт?

  • 0
    Какое правило для каких рейтингов размещается в dataA, dataB и т. Д.?
  • 0
    Как сказано, обзоры в массиве, поэтому каждое значение отзыва должно отображаться как dataN.
Теги:
charts
radar-chart

1 ответ

0
Лучший ответ

Вам не нужно forEach, когда вы уменьшаете, это делает ваш код более функциональным и неизменным

const api_data = {
  reviews: [
    {average_rating: 6.3,safety_rating: 6.3,comfort_rating: 7.1},
    {average_rating: 6.4,safety_rating: 6.4,comfort_rating: 7.2},
    {average_rating: 7.3,safety_rating: 7.3,comfort_rating: 8.1},
  ]
};

const letters = ["A", "B", "C", "D"];

const format_rating = (reviews) => (rating_name) =>
  reviews.reduce((acc, review, index) =>
    ({...acc,
     ['data${letters[index]}']: review[rating_name]}),
    {rating: rating_name});

const ratings = ["average_rating", "safety_rating", "comfort_rating"];

const radar_data = ratings.map(format_rating(api_data.reviews));

console.log(radar_data);

Ещё вопросы

Сообщество Overcoder
Наверх
Меню