reactjs 如何从3个二维数组中求出累加总数组

ajsxfq5m  于 2022-12-18  发布在  React
关注(0)|答案(1)|浏览(101)

我有3个二维数组,如下所示,这是一系列的数据,以绘制线的图形与关键是时间戳。

const arr1 = [[1641013200000,1881],[1643691600000,38993],[1646110800000,41337],[1648785600000,78856],[1651377600000,117738],[1654056000000,119869],[1656648000000,157799],[1659326400000,196752],[1662004800000,199061],[1664596800000,237034],[1667275200000,239153],[1669870800000,269967]]
const arr2 = [[1641013200000,1302],[1643691600000,3347],[1646110800000,4754],[1648785600000,6948],[1651377600000,9725],[1654056000000,11314],[1656648000000,13787],[1659326400000,16666],[1662004800000,18370],[1664596800000,20876],[1667275200000,22384],[1669870800000,23560]]
const arr3 = [[1643691600000,67350],[1648785600000,134700],[1651377600000,202148],[1654056000000,202270],[1656648000000,269843],[1659326400000,337346],[1662004800000,337470],[1664596800000,404861],[1667275200000,404889],[1669870800000,472239]]

我想绘制另一条系列线,给出所有三个数组值的累计总和(注意:如果两个数组中均不存在时间戳,则添加上一个索引值)

const totalArray = [
[1641013200000,3183],[1643691600000, 109690],[1646110800000, 113441],[1648785600000, 220504],
[1651377600000, 329611],[1654056000000, 333453],[1656648000000, 441429],[1659326400000, 550764],
[1662004800000, 554901],[1664596800000, 662771],[1667275200000, 666426],[1669870800000, 765766]
]

我尝试过这种方法,但由于时间戳不在其中任何一个中,因此某些值不正确
方法:

const arr1 = [[1641013200000,1881],[1643691600000,38993],[1646110800000,41337],[1648785600000,78856],[1651377600000,117738],[1654056000000,119869],[1656648000000,157799],[1659326400000,196752],[1662004800000,199061],[1664596800000,237034],[1667275200000,239153],[1669870800000,269967]];
const arr2 = [[1641013200000,1302],[1643691600000,3347],[1646110800000,4754],[1648785600000,6948],[1651377600000,9725],[1654056000000,11314],[1656648000000,13787],[1659326400000,16666],[1662004800000,18370],[1664596800000,20876],[1667275200000,22384],[1669870800000,23560]];
const arr3 = [[1643691600000,67350],[1648785600000,134700],[1651377600000,202148],[1654056000000,202270],[1656648000000,269843],[1659326400000,337346],[1662004800000,337470],[1664596800000,404861],[1667275200000,404889],[1669870800000,472239]];

const calculateTotal = () => {
    var ret;

    for(let a3 of arr3) {
      var index = arr1.map(function(el){return el[0];}).indexOf(a3[0]);
      console.log(index);
      if (index === -1) {
        ret = arr1[index][0];
        console.log(ret);
      }
    }
    let unsortedArr = arr1.concat(arr2, arr3);
    var sortedArray = unsortedArr.sort((a, b) => a[0] - b[0]);
    var added = addArray(sortedArray);
    console.log("Curent Output: " + JSON.stringify(added));
} 

const addArray = (tuples) => {
    var hash = {},
      keys = [];
      tuples.forEach(function (tuple) {
        var key = tuple[0],
            value = tuple[1];
        if (hash[key] === undefined) {
          keys.push(key);
          hash[key] = value;
        } else {
          hash[key] += value;
        }
      });
      return keys.map(function (key) {
        return([key, hash[key]]);
      });
}

calculateTotal();

[Code沙盒链接][1] [1]:https://codesandbox.io/s/tender-blackburn-rgwns3?file=/src/App.js:1349-1761
有没有可能做到这一点?

i1icjdpr

i1icjdpr1#

在您的代码中有这样的内容:

if (index === -1) {
    ret = arr1[index][0];

但是,由于arr1[-1]没有定义,因此该赋值将失败。
当你这么做的时候:

let unsortedArr = arr1.concat(arr2, arr3);

......当三个数组中的 * 任何一个 * 具有“缺失”的时间戳时,您将得到一个不知道使用默认值(来自先前索引)的数组。
我建议采用以下方法:
1.将所有唯一时间戳(来自所有数组)收集到Map中,并将数组与每个键关联:它们最初将为空。
1.使用原始数组中的时间戳填充这些数组
1.从该Map中获取条目的排序列表
1.当相应的槽未定义时,通过将值结转到下一个数组来填充“间隙”。同时,将这些值相加以获得最终输出。
下面是一个实现:

function mergeArrays(...arrays) {
    const map = new Map(arrays.flatMap(arr => arr.map(([stamp]) => [stamp, []])));
    arrays.forEach((arr, i) => {
        for (const [timeStamp, value] of arr) {
            map.get(timeStamp)[i] = value;
        }
    });
    const state = Array(arrays.length).fill(0);
    return Array.from(map).sort(([a], [b]) => a - b).map(([timeStamp, arr], i) =>
        [timeStamp, state.reduce((sum, prev, j) => sum + (state[j] = arr[j] ?? prev), 0)]
    );
} 

// Example run
const arr1 = [[1641013200000,1881],[1643691600000,38993],[1646110800000,41337],[1648785600000,78856],[1651377600000,117738],[1654056000000,119869],[1656648000000,157799],[1659326400000,196752],[1662004800000,199061],[1664596800000,237034],[1667275200000,239153],[1669870800000,269967]];
const arr2 = [[1641013200000,1302],[1643691600000,3347],[1646110800000,4754],[1648785600000,6948],[1651377600000,9725],[1654056000000,11314],[1656648000000,13787],[1659326400000,16666],[1662004800000,18370],[1664596800000,20876],[1667275200000,22384],[1669870800000,23560]];
const arr3 = [[1643691600000,67350],[1648785600000,134700],[1651377600000,202148],[1654056000000,202270],[1656648000000,269843],[1659326400000,337346],[1662004800000,337470],[1664596800000,404861],[1667275200000,404889],[1669870800000,472239]];

const result = mergeArrays(arr1, arr2, arr3);
console.log(result);

相关问题