鍍金池/ 問答/HTML/ JS數(shù)據(jù)轉(zhuǎn)成父子節(jié)點數(shù)據(jù)

JS數(shù)據(jù)轉(zhuǎn)成父子節(jié)點數(shù)據(jù)

原始的數(shù)據(jù)是平鋪的 比如

originalData: [
        { company: 'AAA', department:'AAA-D1', office: 'AAA-D1-O1', pass: 1, onhold: 3},
        { company: 'AAA', department:'AAA-D1', office: 'AAA-D1-O2', pass: 3, onhold: 5},
        { company: 'AAA', department:'AAA-D2', office: 'AAA-D2-O1', pass: 2, onhold: 7},
        { company: 'BBB', department:'BBB-D1', office: 'BBB-D1-O1', pass: 1, onhold: 3},
        { company: 'BBB', department:'BBB-D2', office: 'BBB-D2-O1', pass: 4, onhold: 3},
        { company: 'BBB', department:'BBB-D3', office: 'BBB-D3-O1', pass: 1, onhold: 3},
        ....
        ....
      ]

希望轉(zhuǎn)換成

treeData: [
    { label: 'AAA', department:'AAA-D1', office: 'AAA-D1-O1', pass: 6, onhold: 15,   // company level 
        children: [  // department level 
            {label: 'AAA-D1',  pass: 4, onhold: 8,
                children: [  // office level
                    {label: 'AAA-D1-O1', pass: 1, onhold: 3},
                    {label: 'AAA-D1-O2', pass: 1, onhold: 3},
                ]
            },
            {label: 'AAA-D2',  pass: 2, onhold: 7,
                children: [
                    {label: 'AAA-D2-O1', pass: 1, onhold: 3},
                ]
            },
        ]
    },
    ...
    ...
]
    

根據(jù)指定的列 轉(zhuǎn)換成父子結(jié)構(gòu)的數(shù)據(jù) 比如 上面的是根據(jù) ['company', 'department', 'office'] 不知道怎么寫了 請大神指導(dǎo) :( :( :( :( :(

回答
編輯回答
囍槑

你的輸出格式應(yīng)該有問題,起碼
label: 'AAA', department:'AAA-D1', office: 'AAA-D1-O1', pass: 6, onhold: 15, // company level 是不合理的,最多是label: 'AAA', pass: 6, onhold: 15, // company level
如果數(shù)據(jù)能夠保證全是這樣的結(jié)構(gòu)(只有如上的3級),其實還是比較好處理的。

var moriginalData= [
        { company: 'AAA', department:'AAA-D1', office: 'AAA-D1-O1', pass: 1, onhold: 3},
        { company: 'AAA', department:'AAA-D1', office: 'AAA-D1-O2', pass: 3, onhold: 5},
        { company: 'AAA', department:'AAA-D2', office: 'AAA-D2-O1', pass: 2, onhold: 7},
        { company: 'BBB', department:'BBB-D1', office: 'BBB-D1-O1', pass: 1, onhold: 3},
        { company: 'BBB', department:'BBB-D2', office: 'BBB-D2-O1', pass: 4, onhold: 3},
        { company: 'BBB', department:'BBB-D3', office: 'BBB-D3-O1', pass: 1, onhold: 3}
      ];
function a2o(originalData){
    var outData=[];
    var outObj={};
    for(var i=0;i<originalData.length;i++){
        var company= originalData[i].company;
        var department= originalData[i].department;
        var office={label:originalData[i].office, pass:originalData[i].pass, onhold:originalData[i].onhold};
        if(outObj[company]===undefined){
            outObj[company]={childrenKey:[], pass:0, onhold:0};
        }
        if(outObj[company][department]===undefined){
            outObj[company][department]={children:[], pass:0, onhold:0 };
            outObj[company].childrenKey.push(department)
        }
        outObj[company][department].children.push(office);

        outObj[company][department].pass=outObj[company][department].pass+office.pass;
        outObj[company].pass=outObj[company].pass+office.pass;

        outObj[company][department].onhold=outObj[company][department].onhold+office.onhold;
        outObj[company].onhold=outObj[company].onhold+office.onhold;
    }
    for( var com in outObj){
        var tmpA={label:com, pass:outObj[com].pass, onhold:outObj[com].onhold, children:[]};
        for (var j=0; j<outObj[com].childrenKey.length; j++ ){
            var tD=outObj[com][ outObj[com].childrenKey[j] ];
            tmpA.children.push({label:outObj[com].childrenKey[j] ,
                                pass:tD.pass , 
                                onhold:tD.onhold ,
                                children:tD.children} );
        }
        outData.push(tmpA);
    }
    return outData;
}   

var treeDate=a2o(moriginalData)
console.log(treeDate);  
2017年11月24日 06:55
編輯回答
櫻花霓

答完才發(fā)現(xiàn)你要的是能根據(jù)指定列進(jìn)行映射...

那我再想想,下面的當(dāng)參考吧 ORZ...


var map = originalData.reduce((p, c) => {
    let {company, department, office, pass, onhold} = c
    if (!p[company]) p[company] = {}
    if (!p[company][department]) p[company][department] = {}
    p[company][department][office] = {pass, onhold}
    return p
}, {})

var reduce = (obj, key) => obj.children.reduce((p, c) => [p += c[key], p][1], 0)

var result = Object.keys(map).map(cKey => {
    let company = {label: cKey}
    company.children = Object.keys(map[cKey]).map(dKey => {
        let department = {label: dKey}
        department.children = Object.keys(map[cKey][dKey]).map(oKey => {
            let office = map[cKey][dKey][oKey]
            return {label: oKey, pass: office.pass, onhold: office.onhold}
        })
        ['onhold', 'pass'].forEach(key => department[key] = reduce(department, key))
        return department
    })
    ['onhold', 'pass'].forEach(key => company[key] = reduce(company, key))
    return company
})

輸出:

[
    { 
        "label": "AAA", "onhold": 15,"pass": 6
         "children": [ { "label": "AAA-D1", "onhold": 8, "pass": 4
                         "children": [ { "label": "AAA-D1-O1", "pass": 1, "onhold": 3 },
                                       { "label": "AAA-D1-O2", "pass": 3, "onhold": 5 }]
                       }, {
                         "label": "AAA-D2", "onhold": 7,"pass": 2
                         "children": [ { "label": "AAA-D2-O1", "pass": 2, "onhold": 7 } ]
                       }]
    }, {
        "label": "BBB", "onhold": 9,"pass": 6
        "children": [ { "label": "BBB-D1", "onhold": 3, "pass": 1
                        "children": [ { "label": "BBB-D1-O1", "pass": 1, "onhold": 3 }] 
                      }, {
                         "label": "BBB-D2", "onhold": 3,"pass": 4
                         "children": [ { "label": "BBB-D2-O1", "pass": 4, "onhold": 3 } ]
                      }, {
                          "label": "BBB-D3", "onhold": 3,"pass": 1
                          "children": [ { "label": "BBB-D3-O1", "pass": 1, "onhold": 3 } ]
                      }]
   }]

思路上是先把原始數(shù)組做一次樹級映射,然后再從樹生成各層次信息,這樣會比較好理解一些。

你題目描述中有一些奇怪的地方:company level 里的 departmentoffice 的取值標(biāo)準(zhǔn)不清楚,所以就沒寫,不過這個要加也就是在生成 result 那一步,創(chuàng)建 company 時加入節(jié)點信息即可,不會很難。

2018年4月26日 04:43