Обработка данных в D3.js

Question

У меня есть следующие данные:

var data = [
  {Name:"A", Var:"15", Temp:"20",Lo:"T"},
  {Name:"B", Var:"45", Temp:"40",Lo:"F"},
  {Name:"B", Var:"63", Temp:"340",Lo:"T"},
  {Name:"A", Var:"415", Temp:"450",Lo:"F"},
  {Name:"B", Var:"405", Temp:"940",Lo:"F"},
  {Name:"B", Var:"415", Temp:"410",Lo:"T"},
  {Name:"A", Var:"24", Temp:"51",Lo:"T"},
  {Name:"C", Var:"43", Temp:"40",Lo:"T"},
  {Name:"A", Var:"41", Temp:"40",Lo:"F"}
]

Я фильтрую данные, чтобы получить

dataFiltered = [
  {Name:"A", Var:"15", Temp:"20",Lo:"T"},
  {Name:"A", Var:"415", Temp:"450",Lo:"F"},
  {Name:"A", Var:"24", Temp:"51",Lo:"T"},
  {Name:"A", Var:"41", Temp:"40",Lo:"F"}
]

Но я хочу получить новый массив объектов, таких как:

dataNew = [
  {Vt:"35", Tv:"5"},
  {Vt:"865", Tv:"35"},
  {Vt:"75", Tv:"27"},
  {Vt:"80", Tv:"-1"}
]

Наконец, я хочу использовать dataNew для представления агрегированных данных для Vt (35+865+75+80) и Tv (5+35+27-1) на круговой диаграмме.

Примечание Vt = Var + Temp и Tv = Temp - Var из dataFiltered.

Я действительно не знаю, что делать после фильтрации данных и, в частности, как получить dataNew.

Здесь я также оставляю код для фильтрующей части..

var filteredData = data.filter(function(d) {
    return d.Name == "A";
});

Answer 1

Вы можете получить весь необходимый вывод за одну итерацию поверх исходных данных, используя Array.reduce () , чтобы сгенерировать object с новым массивом данных и накопленными значениями для Vt и Tv, пример:

var data = [
  {Name:"A", Var:"15", Temp:"20", Lo:"T"},
  {Name:"B", Var:"45", Temp:"40", Lo:"F"},
  {Name:"B", Var:"63", Temp:"340", Lo:"T"},
  {Name:"A", Var:"415", Temp:"450", Lo:"F"},
  {Name:"B", Var:"405", Temp:"940", Lo:"F"},
  {Name:"B", Var:"415", Temp:"410", Lo:"T"},
  {Name:"A", Var:"24", Temp:"51", Lo:"T"},
  {Name:"C", Var:"43", Temp:"40", Lo:"T"},
  {Name:"A", Var:"41", Temp:"40", Lo:"F"}
];

function reduceData(data, type)
{
    return data.reduce((acc, {Name, Var, Temp}) =>
    {
        if (Name !== type)
            return acc;

        let Vt = (+Var) + (+Temp), Tv = Temp - Var;
        let len = acc.newData.push({Vt, Tv});
        acc.acc_vt += Vt;
        acc.acc_tv += Tv;
        acc.avg_tv = (acc.avg_tv * (len-1) + Tv) / len;
        acc.avg_vt = (acc.avg_vt * (len-1) + Vt) / len;
        return acc;

    }, {newData: [], acc_vt: 0, acc_tv: 0, avg_vt: 0, avg_tv: 0})
}

console.log(reduceData(data, "A"));

.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}

Answer 2

Вы можете отобразить эти отфильтрованные данные в желаемый формат, используя map, а затем вы можете использовать reduce, чтобы получить всего Tv и Vt значений

let dataFiltered = [{Name:"A", Var:"15", Temp:"20",Lo:"T"},{Name:"A", Var:"415", Temp:"450",Lo:"F"},{Name:"A", Var:"24", Temp:"51",Lo:"T"},{Name:"A", Var:"41", Temp:"40",Lo:"F"},]
        
let newData = dataFiltered.map(({Var, Temp}) => {
  let Vt = Number(Var) + Number(Temp)
  let Tv = Temp - Var
  return {Vt,Tv}  
})

console.log(newData)

let aggregateData = newData.reduce((op,{Tv,Vt})=>{
  op['Tv'] = op['Tv'] || 0
  op['Vt'] = op['Vt'] || 0
  op['Tv'] +=Tv
  op['Vt'] +=Vt
  return op
},{})

console.log(aggregateData)