My goal is to format data for use with the amCharts library. The required structure should look like this:
data = [{
name: "First",
total: 190,
children: [
{
name: "A1",
value: 100
},
{
name: "A2",
value: 60
},
{
name: "A3",
value: 30
},
],
name: "Second",
total: 150,
children: [
{
name: "B1",
value: 100
},
{
name: "B2",
value: 30
},
{
name: "B3",
value: 20
},
]
}]
The current prepared data looks like this:
const data = {
'Corporate Investors': {
total: 7, // total number of 'Corporate Investors', not the sum total of 'stages'
stages: {
Seed: 7,
'Series A': 7,
'Series B': 7,
'Series C': 7,
'Series D': 7
}
},
'Angel investor': {
total: 11,
stages: {
Seed: 10,
'Series A': 10,
'Series B': 11,
'Series C': 11,
'Series D': 9
}...
To convert this object into an array suitable for amCharts, I have created a helper function based on one of their demos available at:
function processData(data) {
const treeData = [];
let typeData = {};
// loops through the outer 'Angel investor' type-keys
for (const key of Object.keys(data)) {
typeData = { name: key, total: data[key].total, children: [] };
// loops over the 'stages' for each of the outer keys
for (const stage of Object.keys(data[key].stages)) {
typeData.children.push({ name: stage, count: data[key].stages[stage] });
}
console.log('typeData pre-push: ', typeData);
console.log('treeData pre-push: ', treeData);
treeData.push(typeData);
console.log('treeData post-push: ', treeData);
}
return treeData;
}
Although my function successfully converts the original object into the desired array format for amCharts, I seem to encounter an issue when pushing it into treeData as the CHILDREN values are lost. This discrepancy has been confirmed by logging the data in my react component, showing that the children array is empty.
I am trying to understand what causes the loss of children values when pushing the data into treeData?