Date filtering of array of objects with timestamps [chart added]

up vote
2
down vote

favorite

I want to feed a linear chart with a simple array [0,1,2,...] representing sums of amount divided by days. The input array has a complex structure, so my first take on it was as follows:

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

It kinda works, I've been struggling for several hours already but I am pretty sure there is a more clever and concise way to handle such situations where you want to quickly sort and sum array values depending on your time needs.

Yep, that final [0,1...] is lame as hell, doing this I tried to execute the function 11 times as my chart goes for last 11 days (Array(11) didn't work out for some reason, values were empty).

Please help me to KO this ugly m*ker!

EDIT: Have added the desired chart for getting the idea. There might be days without earnings. The chart always shows last 11 days, so the time window will be sliding every days leaving non-relevant values off the chart.

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

Not entirely clear what "sums of amount divided by days" means. What are expected results from data sample shown?
– charlietfl
Nov 19 at 17:22

Objects are {amount:X, timestamp:Y}. To sum all amounts within a day, repeat for other days.
– Igniter
Nov 19 at 17:24

The time period starts with a day represented by timestamp and ends with timestamp of the following object?
– HynekS
Nov 19 at 17:26

@HynekS I count days like this Math.round((Date.now() - e.timestamp) / 8.64e7. When invoking a function I then filter the new array of [day, amount] with by a specific day index.
– Igniter
Nov 19 at 17:29

@HynekS that Math.round gives how many days passed since that specific object {amount:X, timestamp:Y} was created relatively to current day. Finally it would be a simple chart with accumulated amounts for last 11 days.
– Igniter
Nov 19 at 17:36

add a comment |

up vote
2
down vote

favorite

I want to feed a linear chart with a simple array [0,1,2,...] representing sums of amount divided by days. The input array has a complex structure, so my first take on it was as follows:

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

Please help me to KO this ugly m*ker!

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

Not entirely clear what "sums of amount divided by days" means. What are expected results from data sample shown?
– charlietfl
Nov 19 at 17:22

Objects are {amount:X, timestamp:Y}. To sum all amounts within a day, repeat for other days.
– Igniter
Nov 19 at 17:24

The time period starts with a day represented by timestamp and ends with timestamp of the following object?
– HynekS
Nov 19 at 17:26

@HynekS I count days like this Math.round((Date.now() - e.timestamp) / 8.64e7. When invoking a function I then filter the new array of [day, amount] with by a specific day index.
– Igniter
Nov 19 at 17:29

@HynekS that Math.round gives how many days passed since that specific object {amount:X, timestamp:Y} was created relatively to current day. Finally it would be a simple chart with accumulated amounts for last 11 days.
– Igniter
Nov 19 at 17:36

add a comment |

up vote
2
down vote

favorite

I want to feed a linear chart with a simple array [0,1,2,...] representing sums of amount divided by days. The input array has a complex structure, so my first take on it was as follows:

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

Please help me to KO this ugly m*ker!

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

I want to feed a linear chart with a simple array [0,1,2,...] representing sums of amount divided by days. The input array has a complex structure, so my first take on it was as follows:

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

Please help me to KO this ugly m*ker!

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

const data = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 140,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 240,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 340,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 460,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 110,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 120,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 160,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 310,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 210,

      timestamp: 1542018069996

    }

  },

]



function getReduced(index) {

  const y = Object.values(data).map(e => Object.values(e))

    .map(e => Object.values(e)[0])

    .map(e => [Math.round((Date.now() - e.timestamp) / 8.64e7), e.amount])

    .filter(e => e[0] === index).map(e => e[1]);

  if (y === undefined) return 0;

  else return y.reduce((a, b) => a + b, 0);

}



const info = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((e, i) => getReduced(i++));

document.getElementById("info").innerHTML = info;



var ctx = document.getElementById("myChart").getContext('2d');

var myChart = new Chart(ctx, {

    type: 'line',

    data: {

        labels: ["Today","1 day ago","2 days ago","3 days ago","4 days ago","5 days ago","6 days ago","A week ago","8 days ago","9 days ago","10 days ago","11 days ago",],

        datasets: [{

            label: 'Money earned',

            data: info,

            backgroundColor: [

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)',

                'rgba(255, 159, 64, 0.2)',

                'rgba(255, 99, 132, 0.2)',

                'rgba(54, 162, 235, 0.2)',

                'rgba(255, 206, 86, 0.2)',

                'rgba(75, 192, 192, 0.2)',

                'rgba(153, 102, 255, 0.2)'

            ],

            borderColor: [

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)',

                'rgba(255, 159, 64, 1)',

                'rgba(255,99,132,1)',

                'rgba(54, 162, 235, 1)',

                'rgba(255, 206, 86, 1)',

                'rgba(75, 192, 192, 1)',

                'rgba(153, 102, 255, 1)'

            ],

            borderWidth: 3

        }]

    },

    options: {

        scales: {

            yAxes: [{

                ticks: {

                    beginAtZero:true

                }

            }]

        }

    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.js"></script>

<div>Final array for feeding my chart: [<span id="info"></span>]</div>

<canvas id="myChart" width="400" height="400"></canvas>

javascript arrays

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

edited Nov 19 at 18:26

asked Nov 19 at 17:13

Igniter

11818

asked Nov 19 at 17:13

Igniter

11818

asked Nov 19 at 17:13

Igniter

11818

Not entirely clear what "sums of amount divided by days" means. What are expected results from data sample shown?
– charlietfl
Nov 19 at 17:22

Objects are {amount:X, timestamp:Y}. To sum all amounts within a day, repeat for other days.
– Igniter
Nov 19 at 17:24

The time period starts with a day represented by timestamp and ends with timestamp of the following object?
– HynekS
Nov 19 at 17:26

@HynekS I count days like this Math.round((Date.now() - e.timestamp) / 8.64e7. When invoking a function I then filter the new array of [day, amount] with by a specific day index.
– Igniter
Nov 19 at 17:29

@HynekS that Math.round gives how many days passed since that specific object {amount:X, timestamp:Y} was created relatively to current day. Finally it would be a simple chart with accumulated amounts for last 11 days.
– Igniter
Nov 19 at 17:36

add a comment |

Not entirely clear what "sums of amount divided by days" means. What are expected results from data sample shown?
– charlietfl
Nov 19 at 17:22

Objects are {amount:X, timestamp:Y}. To sum all amounts within a day, repeat for other days.
– Igniter
Nov 19 at 17:24

The time period starts with a day represented by timestamp and ends with timestamp of the following object?
– HynekS
Nov 19 at 17:26

@HynekS I count days like this Math.round((Date.now() - e.timestamp) / 8.64e7. When invoking a function I then filter the new array of [day, amount] with by a specific day index.
– Igniter
Nov 19 at 17:29

@HynekS that Math.round gives how many days passed since that specific object {amount:X, timestamp:Y} was created relatively to current day. Finally it would be a simple chart with accumulated amounts for last 11 days.
– Igniter
Nov 19 at 17:36

Not entirely clear what "sums of amount divided by days" means. What are expected results from data sample shown?
– charlietfl
Nov 19 at 17:22

Objects are {amount:X, timestamp:Y}. To sum all amounts within a day, repeat for other days.
– Igniter
Nov 19 at 17:24

The time period starts with a day represented by timestamp and ends with timestamp of the following object?
– HynekS
Nov 19 at 17:26

@HynekS I count days like this Math.round((Date.now() - e.timestamp) / 8.64e7. When invoking a function I then filter the new array of [day, amount] with by a specific day index.
– Igniter
Nov 19 at 17:29

@HynekS that Math.round gives how many days passed since that specific object {amount:X, timestamp:Y} was created relatively to current day. Finally it would be a simple chart with accumulated amounts for last 11 days.
– Igniter
Nov 19 at 17:36

add a comment |

5 Answers
5

active

oldest

votes

up vote
0
down vote

accepted

If I understood your question correctly you could use a single reduce like this:

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

The idea is to start with pre-filled array of 0 via new Array(11).fill(0) and use that as the accumulator for the reduce. Since the date key only affects 2 elements [indexes 7 and 10] the reduce will only update those leaving the rest as 0s to match the expected output.

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

add a comment |

up vote
0
down vote

You can get code a little cleaner by removing large and hardly readable chained construction, and also by getting rid of this magic 8.64e7 number:

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

You can now fill in missing dates with 0 if you know the range of observed dates, or just pass it to a chart library, they usually can handle missing dates.

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

add a comment |

up vote
0
down vote

Ok so probably the only bad thing about the way I have done this is that I take advantage of the fact that all of the days in the original array are close together. If you were going to implement this in your code, I would recommend taking some time to do a better job finding the difference in the number of days.

function reduce(array) {



        let resultArray = Array(11).fill(0);



        array.forEach(element => {

            var elementKey = Object.keys(element);

            var thisElement = element[elementKey];



            var date = new Date(thisElement.timestamp);

            var currentDate = new Date();



            var numOfDaysAgo = currentDate.getDate() - date.getDate();



            resultArray[numOfDaysAgo] += thisElement.amount;



        });



        return resultArray;



    }





    console.log(reduce(data));  //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

1

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

|
show 1 more comment

up vote
0
down vote

Maybe a bit more readable with for loops:

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

for...in statement to enumerate object keys.

for...of statement (new in ES6 and not supported in IE) to itterate over the values of array-like objects.

Array(11) by itself creates empty array object (without keys and values) with length 11, similar to :

const info = ;

info.length = 11;

That is why .fill(0) is used to populate it with 0 values.

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

add a comment |

up vote
0
down vote

Alternative for enumerating the values during parsing :

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

answered Nov 19 at 20:26

Slai

15k32235

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53379621%2fdate-filtering-of-array-of-objects-with-timestamps-chart-added%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

5 Answers
5

active

oldest

votes

5 Answers
5

active

oldest

votes

up vote
0
down vote

accepted

If I understood your question correctly you could use a single reduce like this:

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

add a comment |

up vote
0
down vote

accepted

If I understood your question correctly you could use a single reduce like this:

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

add a comment |

up vote
0
down vote

accepted

If I understood your question correctly you could use a single reduce like this:

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

If I understood your question correctly you could use a single reduce like this:

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

const data = [{ LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ]



const group = arr => arr.reduce((r,c) => {

  let key = Object.keys(c)[0], date = Math.round((Date.now() - c[key].timestamp) / 864e5)

  r[date] += c[key].amount

  return r

}, new Array(11).fill(0))



console.log(group(data)) //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

edited Nov 19 at 19:16

answered Nov 19 at 18:29

Akrion

7,54611222

answered Nov 19 at 18:29

Akrion

7,54611222

answered Nov 19 at 18:29

Akrion

7,54611222

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

add a comment |

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

Thank you for your help! This solution is the fastest so far. It doesn't speak for itself as for-of-for-in but anyway a good looking one. Haven't wrapped my head around reduce() in details yet though. :/
– Igniter
Nov 19 at 19:13

Thanks. Added more details.
– Akrion
Nov 19 at 19:16

add a comment |

up vote
0
down vote

You can get code a little cleaner by removing large and hardly readable chained construction, and also by getting rid of this magic 8.64e7 number:

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

You can now fill in missing dates with 0 if you know the range of observed dates, or just pass it to a chart library, they usually can handle missing dates.

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

add a comment |

up vote
0
down vote

You can get code a little cleaner by removing large and hardly readable chained construction, and also by getting rid of this magic 8.64e7 number:

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

You can now fill in missing dates with 0 if you know the range of observed dates, or just pass it to a chart library, they usually can handle missing dates.

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

add a comment |

up vote
0
down vote

You can get code a little cleaner by removing large and hardly readable chained construction, and also by getting rid of this magic 8.64e7 number:

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

You can now fill in missing dates with 0 if you know the range of observed dates, or just pass it to a chart library, they usually can handle missing dates.

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

You can get code a little cleaner by removing large and hardly readable chained construction, and also by getting rid of this magic 8.64e7 number:

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

You can now fill in missing dates with 0 if you know the range of observed dates, or just pass it to a chart library, they usually can handle missing dates.

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

function process(data)

{

  // get rid of weird object keys

  let eventsArray = data.map(x => Object.values(x)[0]); // [{ amount, timestamp }, { amount, timestamp }, ...]

  

  // convert timestamp to date

  eventsArray.forEach(x => { // [{ amount, timestamp, date }, { amount, timestamp, date }...]

    x.date = new Date(x.timestamp).toLocaleDateString(); // consider using something better

  }); 

  

  // group and sum by date

  let byDate = eventsArray.reduce((dic, x) => {

    dic[x.date] = dic[x.date] === undefined ? x.amount : dic[x.date] + x.amount;

    return dic;

  }, {});

  

  return byDate;

}



const input = [{

    LQsZ2cuD1n5U10Rhg9p: {

      amount: 14,

      timestamp: 1541768493811

    }

  },

  {

    LR6Bx6pih4TRID9i3LW: {

      amount: 24,

      timestamp: 1542014096044

    }

  },

  {

    LR6IbF4Q0SI9TZ6Sh5h: {

      amount: 34,

      timestamp: 1542015841476

    }

  },

  {

    LR6NLdgGd2UgTMpnYYE: {

      amount: 46,

      timestamp: 1542017084204

    }

  },

  {

    LR6R5ql8lJW_gTctXB6: {

      amount: 11,

      timestamp: 1542018068191

    }

  },

  {

    LR6R5v0ag8twyTjeupC: {

      amount: 12,

      timestamp: 1542018068351

    }

  },

  {

    LR6R5xZZ4VNCIud71MP: {

      amount: 16,

      timestamp: 1542018069574

    }

  },

  {

    LR6R5zz5QrvrM_RTrvT: {

      amount: 31,

      timestamp: 1542018069716

    }

  },

  {

    LR6R6Aser7lmvrGetzm: {

      amount: 21,

      timestamp: 1542018069996

    }

  },

];



console.log(process(input));

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

answered Nov 19 at 17:37

Yeldar Kurmangaliyev

24k93565

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

add a comment |

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

Thank you for a reply! Have added some visuals to the question.
– Igniter
Nov 19 at 18:18

add a comment |

up vote
0
down vote

function reduce(array) {



        let resultArray = Array(11).fill(0);



        array.forEach(element => {

            var elementKey = Object.keys(element);

            var thisElement = element[elementKey];



            var date = new Date(thisElement.timestamp);

            var currentDate = new Date();



            var numOfDaysAgo = currentDate.getDate() - date.getDate();



            resultArray[numOfDaysAgo] += thisElement.amount;



        });



        return resultArray;



    }





    console.log(reduce(data));  //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

1

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

|
show 1 more comment

up vote
0
down vote

function reduce(array) {



        let resultArray = Array(11).fill(0);



        array.forEach(element => {

            var elementKey = Object.keys(element);

            var thisElement = element[elementKey];



            var date = new Date(thisElement.timestamp);

            var currentDate = new Date();



            var numOfDaysAgo = currentDate.getDate() - date.getDate();



            resultArray[numOfDaysAgo] += thisElement.amount;



        });



        return resultArray;



    }





    console.log(reduce(data));  //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

1

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

|
show 1 more comment

up vote
0
down vote

function reduce(array) {



        let resultArray = Array(11).fill(0);



        array.forEach(element => {

            var elementKey = Object.keys(element);

            var thisElement = element[elementKey];



            var date = new Date(thisElement.timestamp);

            var currentDate = new Date();



            var numOfDaysAgo = currentDate.getDate() - date.getDate();



            resultArray[numOfDaysAgo] += thisElement.amount;



        });



        return resultArray;



    }





    console.log(reduce(data));  //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

function reduce(array) {



        let resultArray = Array(11).fill(0);



        array.forEach(element => {

            var elementKey = Object.keys(element);

            var thisElement = element[elementKey];



            var date = new Date(thisElement.timestamp);

            var currentDate = new Date();



            var numOfDaysAgo = currentDate.getDate() - date.getDate();



            resultArray[numOfDaysAgo] += thisElement.amount;



        });



        return resultArray;



    }





    console.log(reduce(data));  //(11) [0, 0, 0, 0, 0, 0, 0, 195, 0, 0, 14]

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

edited Nov 19 at 18:49

answered Nov 19 at 18:36

Katie.Sun

42611

answered Nov 19 at 18:36

Katie.Sun

42611

answered Nov 19 at 18:36

Katie.Sun

42611

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

1

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

|
show 1 more comment

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

1

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

Thank you for a reply! Your solution is not a laconic one I should say. I was looking for a short one-liner ideally but it looks like such manipulations might be performed with a help of libraries only. :/
– Igniter
Nov 19 at 18:50

No, but I'm the type of coder who prefers readability to brevity
– Katie.Sun
Nov 19 at 18:51

I am more of process.env.NODE_ENV !== 'production'
– Igniter
Nov 19 at 18:54

Also there are performance issues. It's 2 times slower than reduce() of @Akrion and for-of-for-in of @Slai. The slowest one is that first solution similar to yours. Interesting.
– Igniter
Nov 19 at 19:09

Maybe, but when you look at it someone who knows JavaScript can comprehend pretty easily what it's supposed to be doing.
– Katie.Sun
Nov 19 at 19:21

|
show 1 more comment

up vote
0
down vote

Maybe a bit more readable with for loops:

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

for...in statement to enumerate object keys.

for...of statement (new in ES6 and not supported in IE) to itterate over the values of array-like objects.

Array(11) by itself creates empty array object (without keys and values) with length 11, similar to :

const info = ;

info.length = 11;

That is why .fill(0) is used to populate it with 0 values.

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

add a comment |

up vote
0
down vote

Maybe a bit more readable with for loops:

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

for...in statement to enumerate object keys.

for...of statement (new in ES6 and not supported in IE) to itterate over the values of array-like objects.

Array(11) by itself creates empty array object (without keys and values) with length 11, similar to :

const info = ;

info.length = 11;

That is why .fill(0) is used to populate it with 0 values.

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

add a comment |

up vote
0
down vote

Maybe a bit more readable with for loops:

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

for...in statement to enumerate object keys.

for...of statement (new in ES6 and not supported in IE) to itterate over the values of array-like objects.

Array(11) by itself creates empty array object (without keys and values) with length 11, similar to :

const info = ;

info.length = 11;

That is why .fill(0) is used to populate it with 0 values.

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

Maybe a bit more readable with for loops:

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

for...in statement to enumerate object keys.

for...of statement (new in ES6 and not supported in IE) to itterate over the values of array-like objects.

Array(11) by itself creates empty array object (without keys and values) with length 11, similar to :

const info = ;

info.length = 11;

That is why .fill(0) is used to populate it with 0 values.

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

const data = [ { LQsZ2cuD1n5U10Rhg9p: { amount: 14, timestamp: 1541768493811 } }, 

               { LR6Bx6pih4TRID9i3LW: { amount: 24, timestamp: 1542014096044 } }, 

               { LR6IbF4Q0SI9TZ6Sh5h: { amount: 34, timestamp: 1542015841476 } }, 

               { LR6NLdgGd2UgTMpnYYE: { amount: 46, timestamp: 1542017084204 } }, 

               { LR6R5ql8lJW_gTctXB6: { amount: 11, timestamp: 1542018068191 } }, 

               { LR6R5v0ag8twyTjeupC: { amount: 12, timestamp: 1542018068351 } }, 

               { LR6R5xZZ4VNCIud71MP: { amount: 16, timestamp: 1542018069574 } }, 

               { LR6R5zz5QrvrM_RTrvT: { amount: 31, timestamp: 1542018069716 } }, 

               { LR6R6Aser7lmvrGetzm: { amount: 21, timestamp: 1542018069996 } }, ];



const info = Array(11).fill(0);



for (let obj of data)

  for (let key in obj)

    info[Math.round((Date.now() - obj[key].timestamp) / 864e5)] += obj[key].amount;



console.log( JSON.stringify(info) );

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

edited Nov 19 at 19:43

answered Nov 19 at 18:03

Slai

15k32235

answered Nov 19 at 18:03

Slai

15k32235

answered Nov 19 at 18:03

Slai

15k32235

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

add a comment |

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

Looks very very promising! Could you please elaborate those for-of and for-in loops a bit for those like me. Can't get the point why you sum info[date] += amount at the end?
– Igniter
Nov 19 at 18:23

Plus 1 for Array(11).fill(0);!
– Igniter
Nov 19 at 18:25

add a comment |

up vote
0
down vote

Alternative for enumerating the values during parsing :

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

answered Nov 19 at 20:26

Slai

15k32235

add a comment |

up vote
0
down vote

Alternative for enumerating the values during parsing :

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

answered Nov 19 at 20:26

Slai

15k32235

add a comment |

up vote
0
down vote

Alternative for enumerating the values during parsing :

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

answered Nov 19 at 20:26

Slai

15k32235

Alternative for enumerating the values during parsing :

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

const json = '[{"LQsZ2cuD1n5U10Rhg9p":{"amount":140,"timestamp":1541768493811}},{"LR6Bx6pih4TRID9i3LW":{"amount":240,"timestamp":1542014096044}},{"LR6IbF4Q0SI9TZ6Sh5h":{"amount":340,"timestamp":1542015841476}},{"LR6NLdgGd2UgTMpnYYE":{"amount":460,"timestamp":1542017084204}},{"LR6R5ql8lJW_gTctXB6":{"amount":110,"timestamp":1542018068191}},{"LR6R5v0ag8twyTjeupC":{"amount":120,"timestamp":1542018068351}},{"LR6R5xZZ4VNCIud71MP":{"amount":160,"timestamp":1542018069574}},{"LR6R5zz5QrvrM_RTrvT":{"amount":310,"timestamp":1542018069716}},{"LR6R6Aser7lmvrGetzm":{"amount":210,"timestamp":1542018069996}}]'

const info = Array(11).fill(0);



JSON.parse(json, (k, v) => 

      v.amount ? info[Math.round((Date.now() - v.timestamp) / 8.64e7)] += v.amount : v)



console.log( JSON.stringify(info) );

answered Nov 19 at 20:26

Slai

15k32235

answered Nov 19 at 20:26

Slai

15k32235

answered Nov 19 at 20:26

Slai

15k32235

answered Nov 19 at 20:26

Slai

15k32235

add a comment |

draft saved

draft discarded

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Ytukyg