Изменить массив объектов в массив с координатами для диаграммы

Question

Обучение JavaScript. Мне нужно построить некоторые данные (я использую Nivo).

У меня есть данные из моего API в формате:

[{"as_at_date":"2020-02-21","value":815202269.5,"num":139},{"as_at_date":"2020-02-25","value":809209302.32,"num":139},{"as_at_date":"2020-03-12","value":723686212.35,"num":139},{"as_at_date":"2020-03-13","value":734798809.24,"num":139},{"as_at_date":"2020-03-16","value":701366943.2,"num":139},{"as_at_date":"2020-03-17","value":710833514.89,"num":139},{"as_at_date":"2020-03-18","value":699154469.83,"num":139},{"as_at_date":"2020-03-19","value":694649684.34,"num":139},{"as_at_date":"2020-03-20","value":685400033.9,"num":139}]

Чтобы построить график с Nivo, мне нужно измените вышеуказанный массив на:

    [{"id": 'XXXXX",
"data": [{"x":"2020-02-21","y":815202269.5},{"x":"2020-02-25","y":809209302.32},{"x":"2020-03-12","y":723686212.35},{"x":"2020-03-13","y":734798809.24},{"x":"2020-03-16","y":701366943.2},{"x":"2020-03-17","y":710833514.89},{"x":"2020-03-18","y":699154469.83},{"x":"2020-03-19","y":694649684.34},{"x":"2020-03-20","y":685400033.9}]

• Игнорировать свойство «num».
• Вложить данные и создать «id»
• Изменить as_at_date на «x ", значение" y "

Последняя попытка была использовать .map как .map(item => [{"x": item['as_at_date']}, {"y": item['value']}]), но это было не совсем правильно.

Спасибо за любую помощь, спасибо!

Answer 1

Я бы использовал .reduce(), чтобы сначала создать вложенные данные. Затем добавьте свойства id и data к конечному объекту.

Попробуйте выполнить следующее:

const data = [{"as_at_date":"2020-02-21","value":815202269.5,"num":139},{"as_at_date":"2020-02-25","value":809209302.32,"num":139},{"as_at_date":"2020-03-12","value":723686212.35,"num":139},{"as_at_date":"2020-03-13","value":734798809.24,"num":139},{"as_at_date":"2020-03-16","value":701366943.2,"num":139},{"as_at_date":"2020-03-17","value":710833514.89,"num":139},{"as_at_date":"2020-03-18","value":699154469.83,"num":139},{"as_at_date":"2020-03-19","value":694649684.34,"num":139},{"as_at_date":"2020-03-20","value":685400033.9,"num":139}];

const nested = data.reduce((a, c) => a.concat({x: c['as_at_date'], y: c['value']}), []);

const result = {
  id: 'XXXXX',
  data: nested
};

console.log(result);

Надеюсь, это поможет!

Answer 2

Вы можете попробовать это

const array = [{"as_at_date":"2020-02-21","value":815202269.5,"num":139},{"as_at_date":"2020-02-25","value":809209302.32,"num":139},{"as_at_date":"2020-03-12","value":723686212.35,"num":139},{"as_at_date":"2020-03-13","value":734798809.24,"num":139},{"as_at_date":"2020-03-16","value":701366943.2,"num":139},{"as_at_date":"2020-03-17","value":710833514.89,"num":139},{"as_at_date":"2020-03-18","value":699154469.83,"num":139},{"as_at_date":"2020-03-19","value":694649684.34,"num":139},{"as_at_date":"2020-03-20","value":685400033.9,"num":139}];

const formatted_array = input.map((item) => {
return {x: item.as_at_date, y: item.value}});

const final_data = {
  id: 'XXXX',
  data: formatted_array ,
};
console.log(final_data);

Answer 3

Ваша попытка была почти правильной, просто опустите окружающие []:

const input = [{"as_at_date":"2020-02-21","value":815202269.5,"num":139},{"as_at_date":"2020-02-25","value":809209302.32,"num":139},{"as_at_date":"2020-03-12","value":723686212.35,"num":139},{"as_at_date":"2020-03-13","value":734798809.24,"num":139},{"as_at_date":"2020-03-16","value":701366943.2,"num":139},{"as_at_date":"2020-03-17","value":710833514.89,"num":139},{"as_at_date":"2020-03-18","value":699154469.83,"num":139},{"as_at_date":"2020-03-19","value":694649684.34,"num":139},{"as_at_date":"2020-03-20","value":685400033.9,"num":139}];

const outputData = input.map(item => ({ x: item.as_at_date, y: item.value }));

console.log(outputData);

const result = {
  id: 'XXXX', // create your id here,
  data: outputData,
};
console.log(result);

Answer 4

map это, конечно, путь к go.

Вот мой подход:

const data = [{"as_at_date":"2020-02-21","value":815202269.5,"num":139},{"as_at_date":"2020-02-25","value":809209302.32,"num":139},{"as_at_date":"2020-03-12","value":723686212.35,"num":139},{"as_at_date":"2020-03-13","value":734798809.24,"num":139},{"as_at_date":"2020-03-16","value":701366943.2,"num":139},{"as_at_date":"2020-03-17","value":710833514.89,"num":139},{"as_at_date":"2020-03-18","value":699154469.83,"num":139},{"as_at_date":"2020-03-19","value":694649684.34,"num":139},{"as_at_date":"2020-03-20","value":685400033.9,"num":139}];

function reformattedData(arr) {

  // Destructure only the required properties
  return arr.map(({ as_at_date, value }) => {

    // And just return those values in a new object
    // using the new property names
    return { x: as_at_date, y: value };
  });
}

const out = { id: 'xxx', data: reformattedData(data) };

console.log(out);