Create chart that sums the values in multiple rows for each series in Javascript [closed]


I am learning to use Ajax and JSON data API to create a combo bar chart that show each NumberOfPerson for 2 Groups(Online-Leow1 and Online Ong),according to each date.

May I know is there any hints to declare the group to return daily NumberOfPerson of each group?

This is my JSON API data:

{"ThisMonthData":[
    {"signage_id":1001,"NumberOfPerson":4,"Date":"2021-November-1st","GroupName":{"name":"Online-Leow1"}},
    {"signage_id":1002,"NumberOfPerson":7,"Date":"2021-November-2nd","GroupName":{"name":"Online-Ong"}},
    {"signage_id":1001,"NumberOfPerson":43,"Date":"2021-November-2nd","GroupName":{"name":"Online-Leow1"}},
    {"signage_id":1002,"NumberOfPerson":1,"Date":"2021-November-3rd","GroupName":{"name":"Online-Ong"}},
    {"signage_id":1002,"NumberOfPerson":2,"Date":"2021-November-4th","GroupName":{"name":"Online-Ong"}},
    {"signage_id":1001,"NumberOfPerson":105,"Date":"2021-November-9th","GroupName":{"name":"Online-Leow1"}},
    {"signage_id":1002,"NumberOfPerson":31,"Date":"2021-November-9th","GroupName":{"name":"Online-Ong"}},
    {"signage_id":1001,"NumberOfPerson":72,"Date":"2021-November-10th","GroupName":{"name":"Online-Leow1"}},
    {"signage_id":1001,"NumberOfPerson":151,"Date":"2021-November-11th","GroupName":{"name":"Online-Leow1"}}]
,"LastMonthData":[
    {"signage_id":1003,"NumberOfPerson":66,"Date":"2021-September-13th","GroupName":{"name":"Online-Lek"}},
    {"signage_id":1003,"NumberOfPerson":77,"Date":"2021-September-14th","GroupName":{"name":"Online-Lek"}},
    {"signage_id":1003,"NumberOfPerson":4,"Date":"2021-September-16th","GroupName":{"name":"Online-Lek"}},
    {"signage_id":1003,"NumberOfPerson":19,"Date":"2021-September-17th","GroupName":{"name":"Online-Lek"}},
    {"signage_id":1003,"NumberOfPerson":5,"Date":"2021-September-19th","GroupName":{"name":"Online-Lek"}},
    {"signage_id":1001,"NumberOfPerson":15,"Date":"2021-September-27th","GroupName":{"name":"Online-Leow1"}},
    {"signage_id":1001,"NumberOfPerson":10,"Date":"2021-September-29th","GroupName":{"name":"Online-Leow1"}}]
,"success":true,"message":""}

[This is my desired output chart]
: https://i.stack.imgur.com/ItLiw.jpg

Source: JavaSript – Stack Overflow

November 27, 2021
Category : News
Tags: ajax | api | charts | javascript | json

Leave a Reply

Your email address will not be published. Required fields are marked *

Sitemap | Terms | Privacy | Cookies | Advertising

Senior Software Developer

Creator of @LzoMedia I am a backend software developer based in London who likes beautiful code and has an adherence to standards & love's open-source.