動的に配列を作成してZingChartツリーマップを更新する方法

Question

ZingCharts用にこのデータ配列を動的に作成しようとしています。

基本的に、私はこのような構成を行う必要があります。

var series = [{ 
    text: "Democratic", 
    style: { 
     backgroundColor: "blue" 
    }, 

    children: [{ 
    text: "California", 
    value: 55, 
    style: { 
     backgroundColor: "blue" 
    }, 

    }, { 
    text: "Oregon", 
    value: 7, 
    style: { 
     backgroundColor: "blue" 
    }, 
    }] 
}, 
{ 
    text: "Republican", 
    style: { 
     backgroundColor: "red" 
    }, 
    children: [{ 
    text: "Texas", 
    value: 38, 
    style: { 
     backgroundColor: "red" 
    }, 
    }, { 
    text: "Georgia", 
    value: 16, 
    style: { 
     backgroundColor: "red" 
    }, 
    }] 
}, { 
    text: "TossUp", 
    style: { 
     backgroundColor: "grey" 
    }, 
    children: [{ 
    text: "Arizona", 
    value: 22, 
    style: { 
     backgroundColor: "grey" 
    }, 
    }] 
}, ] 
}] 
}; 

私はこれを行うための正しい方法があるかわかりません。私はこのような何かを誘惑しています：

result.push("text: '" + data[0].party + "'") 

私はすべての50件の州でこれを行う必要があり、データがこのような構造に来ている：私はすべきで

var data = [{ 
    "color": "blue", 
    "party": "Democratic", 
    "text": "California", 
    "value": 55, 
}, { 
    "color": "blue", 
    "party": "Democratic", 
    "text": "Oregon", 
    "value": 7, 
}, { 
    "color": "red", 
    "party": "Republican", 
    "text": "Texas", 
    "value": 38, 
}, { 
    "color": "red", 
    "party": "Republican", 
    "text": "Georgia", 
    "value": 16, 
}, { 
    "color": "grey", 
    "party": "Democratic", 
    "text": "Arizona", 
    "value": 11, 
}]; 

任意のヒント検索していただければ幸いです。ありがとう！

Answer 1

使用reduce機能とhash tableは、あなたが望むデータ構造を作成します。

var data=[{color:"blue",party:"Democratic",text:"California",value:55},{color:"blue",party:"Democratic",text:"Oregon",value:7},{color:"red",party:"Republican",text:"Texas",value:38},{color:"red",party:"Republican",text:"Georgia",value:16},{color:"grey",party:"Democratic",text:"Arizona",value:11}]; 
 

 
var result = data.reduce(function(hash) { 
 
    return function(prev, curr) { 
 
    if (hash[curr.color]) { 
 
     hash[curr.color].children.push({ 
 
     text: curr.text, 
 
     value: curr.value, 
 
     style: { 
 
      backgroundColor: curr.color 
 
     } 
 
     }); 
 
    } else { 
 
     hash[curr.color] = {}; 
 
     hash[curr.color].children = hash[curr.color].children || []; 
 
     prev.push({ 
 
     text: curr.party, 
 
     style: { 
 
      backgroundColor: curr.color 
 
     }, 
 
     children: hash[curr.color].children 
 
     }); 
 
     hash[curr.color].children.push({ 
 
     text: curr.text, 
 
     value: curr.value, 
 
     style: { 
 
      backgroundColor: curr.color 
 
     } 
 
     }); 
 
    } 
 
    return prev; 
 
    }; 
 
}(Object.create(null)), []); 
 

 
console.log(result);

.as-console-wrapper{top: 0;max-height: 100%!important;}

私は、おかげでこれについて自分の考えを知ってみましょう！