如何将一个数组推入另一个数组内部的对象中?

时间:2018-10-05 12:10:30

标签: javascript multidimensional-array chart.js

在for循环中,我试图将变量数组推入对象内,而对象又位于数组内。 我正在尝试将数据推送到此处: enter image description here

展开的视图: enter image description here

数据最终位置: enter image description here

这是我的代码:

let that.dynamicDataCollection3 = [];
let allDeptNames=["Dept 1","Dept 2","Dept 3","Dept 4","Dept 17"];
let insPerDay = [[["1538474655452","1538474655636","1538474655834","1538474656089","1538474751210","1538474751377","1538474751543","1538474751694","1538474755196","1538474755348","1538485850074","1538485850431","1538485850790","1538485851228"],["1538523551485","1538523551643","1538523551803","1538523552041","1538523552369","1538523553456","1538523553607","1538523553805","1538523554800","1538523554954","1538523555094","1538523555245","1538523555396","1538523555555","1538523557272","1538523557432","1538523557590","1538523557742","1538523557893","1538523558039","1538523558195","1538523559984","1538523564305","1538523564586","1538523564656","1538523568428","1538523568618","1538523569008","1538523569161","1538523571608","1538523572092","1538523572236","1538523572380","1538523572547","1538523572720","1538523572888"],["1538662645663","1538662645815","1538662645982","1538662646160","1538662646332","1538662646531","1538662650368","1538662650528","1538662650703","1538662652400","1538662714705","1538662714888","1538662715071","1538662715264","1538662715468","1538662715675"],["1538730663891","1538730664336"],[],[],[],[],[]],[[],["1538523631290","1538523631442","1538523631602","1538523631770","1538523634732","1538523634876","1538523635043","1538523635197","1538523635370","1538523635560","1538523635727","1538523635894","1538523636061","1538523636227","1538523636403","1538523636578","1538523636752","1538523636927","1538523637103","1538523637285","1538523637460","1538523637667","1538523637874","1538523638073","1538523638250","1538523638430","1538523638637","1538523638827","1538523639105","1538523639268","1538523639480","1538523639678","1538523639948","1538523640075","1538523640522","1538523640772","1538523640936","1538523641126","1538523641325","1538523641502","1538523641674","1538523641857","1538523642039","1538523642262","1538523642453","1538523642621","1538523643009","1538523643220","1538523643431","1538523643854","1538523644138","1538523648438","1538523648606","1538523648778","1538523728062","1538523728332","1538523728516","1538523728694","1538523728881","1538523729376","1538523734863","1538523735038","1538523735204","1538523735371","1538523735531","1538550110609"],["1538662662501","1538662662667","1538662662819","1538662662970","1538662663138","1538662663288","1538662726568","1538662726735","1538662726902","1538662727068","1538662727247","1538662727426","1538662727704"],["1538730451253","1538730451387","1538730451522","1538730451664","1538730451812","1538730451979","1538730500737","1538736000601","1538736000774","1538736000934","1538736001085","1538736001238"],[],[],[],[],[]],[[],["1538523539833","1538523539993","1538523540198","1538523541522","1538523541681","1538523541841","1538523543200","1538523543382","1538523543542","1538523598082","1538523598258","1538523598416","1538523598566","1538523598718","1538523598878","1538523657714","1538523657945","1538523658485","1538523658711","1538552669959","1538552671158","1538552689892"],["1538662672939","1538662673094","1538662673256","1538662673414","1538662673573","1538662673739","1538662673898","1538662674049","1538662674201","1538662674359","1538662674523","1538662706978"],["1538730485439","1538730485580","1538730485743","1538730485874","1538730486049","1538730486200","1538730486358","1538730486510"],[],[],[],[],[]],[["1538474676007","1538474676181","1538474676357","1538474676691","1538474676865","1538474677032","1538474677199","1538474681585","1538474681734","1538474681895","1538474682061","1538474682412","1538474682578","1538474685580","1538474685742","1538474685914","1538474688908","1538474689074","1538474689266","1538474887658","1538474887847","1538474888022","1538474888181","1538474888364"],["1538523513934","1538523514093","1538523514251","1538523514402","1538523514562","1538523514714","1538523516390","1538523516542","1538523516693","1538523520990","1538523521148","1538523521329","1538523521467","1538523521626","1538523521804","1538523521970","1538523523968","1538523528670","1538523529537","1538523529721","1538523529871","1538523530014","1538523530364","1538523530515"],[],["1538730493512","1538730493653","1538730493789","1538730493933","1538730494067","1538730494210","1538730494352"],[],[],[],[],[]],[["1538497087788"],["1538523492819","1538523493057","1538523493307","1538523493708","1538523493884","1538523494098","1538523495942","1538523496133","1538523826322","1538523826488","1538523826680","1538523826847","1538523827176","1538577571657","1538577572300","1538577572817","1538577573806","1538577574157","1538577663486"],["1538609439534","1538609439717","1538609439843","1538609440009","1538609440177","1538609440336","1538609440510","1538609440670","1538609440828","1538609440995","1538609441171","1538609441328","1538609441495","1538609441671","1538609442078","1538609442287","1538609442468","1538662608664","1538662608864","1538662609007","1538662609151","1538662609302","1538662609444","1538662609590","1538662612208","1538662612359","1538662612487","1538662612630","1538662614708","1538662614872","1538662615057","1538662615476","1538662615848","1538662616023","1538662616284","1538662616451","1538662616595","1538662622515","1538662622520","1538662624213","1538662624381","1538662624548","1538662624732","1538662627936","1538662628119","1538662631634","1538662631639","1538662632602","1538662632840","1538662635778","1538663768834","1538663768995","1538663769147","1538663769284","1538663769424","1538663769559","1538663769694","1538663769837","1538663769984","1538663770118","1538663770268","1538663770434","1538663770568"],["1538730505799","1538730505940","1538730506083","1538730506225","1538730506360","1538730506496","1538730506649"],[],[],[],[],[]]]
let that = this; 
let lineColours = ['rgba(248,121,121, 0.9)', 'rgba(255, 80, 248, 0.9)', 'rgba(159, 255, 252, 0.9)', 'rgba(191, 164, 199, 0.9)',  'rgba(206, 255, 225, 0.9)', 'rgba(253, 233, 255, 0.9)']
        let lineBackColours = ['rgba(248,121,121, 0.06)', 'rgba(255, 80, 248, 0.06)', 'rgba(159, 255, 252, 0.06)', 'rgba(191, 164, 199, 0.06)',  'rgba(206, 255, 225, 0.06)', 'rgba(253, 233, 255, 0.06)']
        let datasets = [];
        let datasets_temp = [];
        let data = [];
        for (i =0; i < allDeptNames.length; i++) {

            let datasets = [
                {
                label: allDeptNames[i],
                backgroundColor: lineColours[i],
                backgroundColor: lineBackColours[i],
                borderColor: lineColours[i],
                borderWidth: 2,
                }
            ]
            for (let ipd=0; ipd<insPerDay[i].length; ipd++){
                    let datasets_temp= [insPerDay[i][ipd].length];
                    data.push(datasets_temp)
            }
            datasets.push(data );
            data = [];
            that.dynamicDataCollection3.push(datasets);
        }

正在记录以下内容(将数据推送到对象之外):

enter image description here

that.dynamicDataCollection 对象/数组的预期输出应该是这样的:

[
   [{"label":"Dept 1","backgroundColor":"rgba(248,121,121, 0.06)","data":[0,9,31,14,36,16,2, 0,0,0],"borderColor":"rgba(248,121,121, 0.9)","borderWidth":2}],
   [{"label":"Dept 2","backgroundColor":"rgba(255, 80, 248, 0.06)","data":[0,0,43,0,66,13,12, 0,0,0],"borderColor":"rgba(255, 80, 248, 0.9)","borderWidth":2}],
   [{"label":"Dept 3","backgroundColor":"rgba(159, 255, 252, 0.06)","data":[0,0,49,0,22,12,8, 0,0,0],"borderColor":"rgba(159, 255, 252, 0.9)","borderWidth":2}],
   [{"label":"Dept 4","backgroundColor":"rgba(191, 164, 199, 0.06)","data":[0,0,25,24,24,0,7, 0,0,0],"borderColor":"rgba(191, 164, 199,0.9)","borderWidth":2}],
   [{"label":"Dept17","backgroundColor":"rgba(206,255, 225, 0.06)","data"[0,0,0,1,19,63,7, 0,0,0],"borderColor":"rgba(206, 255, 225, 0.9)","borderWidth":2}]
]

预期结果作为图像: enter image description here

关于如何解决这个问题的任何想法?

2 个答案:

答案 0 :(得分:1)

尝试以下行:

that.dynamicDataCollection3[i].push({data: datasets});

答案 1 :(得分:1)

更改此:

  • 我在您的user: User = { userName: '', password: '', confirmPassword: '' }; submit() { console.log(this.user); } 模板中添加了一个空数组data

    datasets
  • let datasets = [ { label: allDeptNames[i], backgroundColor: lineColours[i], backgroundColor: lineBackColours[i], borderColor: lineColours[i], borderWidth: 2, data: [] // <- Add this } ] 更改为datasets.push(data );

datasets[0].data = data.map(i => i[0]);