Convert nested JSON array into flat JSON array

Convert nested JSON array into flat JSON array - javascript

I have a nested JSON array that getting from a mongoDB query that i would like to convert into flat JSON .I am using nested mondo documents, but i would like to show the data in a more readble way. My JSON has the following structure:
[{
"country": "Country A",
"regions": [{
"region": "region A1",
"cities": [{
"city": "city A11"
},
{
"city": "city A12"
}
]
},
{
"region": "region A2",
"cities": [{
"city": "city A21"
},
{
"city": "city A22"
}
]
}
]
},
{
"country": "Country B",
"regions": [{
"region": "region B1",
"cities": [{
"city": "city B11"
},
{
"city": "city B12"
}
]
},
{
"region": "region B2",
"cities": [{
"city": "city B21"
},
{
"city": "city B22"
}
]
}
]
}
]
I want to show only the important information and not the structure of the nested array.
How i can modify my data in Javascript on order to achieve the following result.
[
{
"country": "Country A",
"region":"Region A1",
"city": "City A11"
},
{
"country": "Country A",
"region":"Region A1",
"city": "City A12"
},
-------------
{
"country": "Country B",
"region":"Region B1",
"city": "City B11"
},
-----------
{
"country": "Country B",
"region":"Region B2",
"city": "City B22"
}
]
What is the simpliest way to acheive this result?

The simplest way is to just loop through and create an array. You can do this with reduce():
let arr = [{"country": "Country A","regions": [{"region": "region A1","cities": [{"city": "city A11"},{"city": "city A12"}]},{"region": "region A2","cities": [{"city": "city A21"},{"city": "city A22"}]}]},{"country": "Country B","regions": [{"region": "region B1","cities": [{"city": "city B11"},{"city": "city B12"}]},{"region": "region B2","cities": [{"city": "city B21"},{"city": "city B22"}]}]}]
let flat = arr.reduce((arr, {country, regions}) => {
regions.forEach(({region, cities}) => {
cities.forEach(({city}) => {
arr.push({country, region, city})
})
})
return arr
}, [])
console.log(flat)

Related

Convert row-data to sunburst chart data for Highcharts library

My Row-Data which I got from my MongoDB database. Now, I want to convert the below data to sunburst chart data. Can anyone help me?
These are my Input data array.
[
{
"globalId": "Chart Global",
"country": "India",
"state": "Gujarat",
"city": "Vadodara",
"mode": "traffic",
"value": 2.9
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Rajsthan",
"city": "Jaipur",
"mode": "traffic",
"value": 2.9
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "traffic",
"value": 100
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "population",
"value": 2000
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "animals",
"value": 5
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "birds",
"value": 0
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "trees",
"value": 0
}
]
I want data for the sunburst Chart for highcharts library
Does anyone have solutions?

As a start point you can use this function (I changed a little bit the data to see more effects):
function seqToBurstData(originalData, circleKeys){
const sunBurstData = [];
const valuePath2pointId = {}; // auxiliary data used to identify the parent id of a point
// get all the values for {dataPoint} from top key to {level} key, joined by '_'
// used to index nameLevel2pointId data, to ensure each point has a unique index value
const valuePath = (dataPoint, level) =>
Array.from({length: level}, (_, i) => dataPoint[circleKeys[i]]).join('_');
circleKeys.forEach(function(key, index){
const level = index + 1;
let currentValuePath = null, nValues = 0, sunBurstPoint;
for(const o of originalData){
const thisValuePath = valuePath(o, level);
if(thisValuePath !== currentValuePath){
currentValuePath = thisValuePath;
sunBurstPoint = {
id: level + '.' + nValues, // scheme similar to Highcharts examples for sunburst
parent: level === 1 ? null : valuePath2pointId[valuePath(o, level - 1)],
name: o[key],
level, // level not required but useful
...(level === circleKeys.length ? {value: o.value} : {}) // only for the final level
};
if(level < circleKeys.length){
valuePath2pointId[currentValuePath] = sunBurstPoint.id;
}
sunBurstData.push(sunBurstPoint);
nValues++;
}
else if(level === circleKeys.length){
sunBurstPoint.value += o.value;
}
}
});
return sunBurstData;
}
const originalData = [
{
"globalId": "Chart Global",
"first": "India",
"state": "Gujarat",
"city": "Vadodara",
"mode": "traffic",
"value": 59
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Rajasthan",
"city": "Jaipur",
"mode": "traffic",
"value": 59
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Rajasthan",
"city": "Ranthambore",
"mode": "tigers",
"value": 40
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "traffic",
"value": 100
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "population",
"value": 200
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "animals",
"value": 50
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "birds",
"value": 5
},
{
"globalId": "Chart Global",
"first": "India",
"state": "Delhi",
"city": "Delhi",
"mode": "trees",
"value": 5
}
];
const sunBurstData = seqToBurstData(originalData, ['first', 'state', 'city', 'mode']).
// add the "intro" key to change the point title according to the level
map(o=>({...o, intro: o.level === 4 ? 'The value of' : 'Total for'}));
Highcharts.chart('chart', {
chart: {
height: '100%'
},
title: {
text: ''
},
series: [{
type: 'sunburst',
data: sunBurstData,
name: sunBurstData[0].name,
allowDrillToNode: true,
cursor: 'pointer',
dataLabels: {
format: '{point.name}'
},
levels: [{
level: 1,
color: 'transparent'
}, {
level: 2,
colorByPoint: true
}, {
level: 3,
colorVariation: {
key: 'brightness',
to: 0.3
}
}, {
level: 4,
colorVariation: {
key: 'brightness',
to: -0.3
}
}]
}],
tooltip: {
headerFormat: '',
pointFormat: '{point.intro} <b>{point.name}</b> is <b>{point.value}</b>'
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/10.3.2/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/sunburst.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>
<div id="chart"></div>

Comparing 2 arrays of nested objects while ignoring some properties in Javascript

I'm looking to check an API response for against a set of values but the API response contains some additional info that I'm not interested in checking against
Data to check:
[
{
"address": {
"city": "London",
"firstLine": "23 High Road",
"postCode": "WC1 1AA",
"region": "South East",
"uniqueIdentifier": 239
},
"detail": {
"leaseholdFreehold": "Freehold",
"location": "Satisfactory",
"sector": "Office"
},
"valuation": {
"value": "770000",
"valuationDate": "2018-03-07",
"yield": "7.75"
}
},
{
"address": {
"city": "Leeds",
"firstLinePropertyName": "45 Headrow",
"postCode": "LS2 8AA",
"region": "North East",
"uniqueIdentifier": 287
},
"detail": {
"leaseholdFreehold": "Freehold",
"location": "Good",
"sector": "Residential"
},
"valuation": {
"value": "88000",
"valuationDate": "2018-03-07",
"yield": "8.87"
}
}
]
API response:
[
{
"address": {
"city": "London",
"firstLine": "23 High Road",
"postCode": "WC1 1AA",
"region": "South East",
"uniqueIdentifier": 239
},
"detail": {
"designAndCondition": "",
"developmentCompletionDate": "0001-01-01",
"leaseholdFreehold": "Freehold",
"location": "Satisfactory",
"sector": "Office"
},
"valuation": {
"value": "770000",
"valuationDate": "2018-03-07",
"yield": "7.75"
},
"dbIdentifier": 240
},
{
"address": {
"city": "Leeds",
"firstLinePropertyName": "11 Main Road",
"postCode": "LS2 8AA",
"region": "North East",
"uniqueIdentifier": 282
},
"detail": {
"designAndCondition": "",
"developmentCompletionDate": "0001-01-01",
"leaseholdFreehold": "Freehold",
"location": "Good",
"sector": "Residential"
},
"valuation": {
"value": "88000",
"valuationDate": "2018-03-07",
"yield": "8.75"
},
"dbIdentifier": 239
}
]
So I'm not interested in what values are returned for dbIdentifier, designAndCondition and developmentCompletionDate as they are not in my data to check against but I would like to compare the values for the rest of the properties. In practice these arrays will have more than 2 items
I was initially thinking I would remove the unwanted properties from the objects using the function below
const newArray = responseBody.map(({ dbIdentifierIdentifier, detail: { designAndCondition, developmentCompletionDate }, ...rest }) => rest)
Then ordering by address.uniqueIdentifier, converting to JSON strings and comparing the strings but the function above doesn't work with the nested properties as newArray doesn't contain the detail object at all
newArray:
[
{
"address": {
"city": "London",
"firstLine": "23 High Road",
"postCode": "WC1 1AA",
"region": "South East",
"uniqueIdentifier": 239
},
"valuation": {
"value": "770000",
"valuationDate": "2018-03-07",
"yield": "7.75"
},
"dbIdentifier": 240
},
{
"address": {
"city": "Leeds",
"firstLinePropertyName": "11 Main Road",
"postCode": "LS2 8AA",
"region": "North East",
"uniqueIdentifier": 282
},
"valuation": {
"value": "88000",
"valuationDate": "2018-03-07",
"yield": "8.75"
},
"dbIdentifier": 239
}
]
IS it possible to do it the above way by passing a destructured nested object a map function?

One way to remove the unwanted properties from the API response would be to first copy the response into a new array (to preserve the original response), then delete the properties:
const apiResponse = [{
"address": {
"city": "London",
"firstLine": "23 High Road",
"postCode": "WC1 1AA",
"region": "South East",
"uniqueIdentifier": 239
},
"detail": {
"designAndCondition": "",
"developmentCompletionDate": "0001-01-01",
"leaseholdFreehold": "Freehold",
"location": "Satisfactory",
"sector": "Office"
},
"valuation": {
"value": "770000",
"valuationDate": "2018-03-07",
"yield": "7.75"
},
"dbIdentifier": 240
},
{
"address": {
"city": "Leeds",
"firstLinePropertyName": "11 Main Road",
"postCode": "LS2 8AA",
"region": "North East",
"uniqueIdentifier": 282
},
"detail": {
"designAndCondition": "",
"developmentCompletionDate": "0001-01-01",
"leaseholdFreehold": "Freehold",
"location": "Good",
"sector": "Residential"
},
"valuation": {
"value": "88000",
"valuationDate": "2018-03-07",
"yield": "8.75"
},
"dbIdentifier": 239
}
]
let apiResponseCopy = JSON.parse(JSON.stringify(apiResponse))
var newArray = apiResponseCopy.map(i => {
delete i.dbIdentifier
delete i.detail.designAndCondition
delete i.detail.developmentCompletionDate
return i
})
console.log(newArray)
Then, you should be able to compare the newArray against your data.

Javascript grouping [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 1 year ago.
Improve this question
I'm receiving data from an Angular service as follow:
{
"data": [
{
"country": "Germany",
"iso": "de",
"city": "Berlin",
"zone": "2",
},
{
"country": "Germany",
"iso": "de",
"city": "Frankfurt",
"zone": "5",
},
{
"country": "USA",
"iso": "us",
"city": "Chicago",
"zone": "18",
},
{
"country": "USA",
"iso": "us",
"city": "New York",
"zone": "16",
},
{
"country": "USA",
"iso": "us",
"city": "San Francisco",
"zone": "54",
}
}
I would like to transform these data so I can use the AutoComplete PrimeNG widget which require the following data format as input:
groupedByCountry = [
{
label: 'Germany', value: 'de',
items: [
{label: 'Berlin', value: '2'},
{label: 'Frankfurt', value: '5'}
]
},
{
label: 'USA', value: 'us',
items: [
{label: 'Chicago', value: '18'},
{label: 'New York', value: '16'},
{label: 'San Francisco', value: '54'}
]
}
];
I'm not doing JavaScript on a daily basis and haven't be able to do this transformation so far. If someone could assist it would be appreciated

this should work:
let input = JSON.parse(`[
{
"country": "Germany",
"iso": "de",
"city": "Berlin",
"zone": "2"
},
{
"country": "Germany",
"iso": "de",
"city": "Frankfurt",
"zone": "5"
},
{
"country": "USA",
"iso": "us",
"city": "Chicago",
"zone": "18"
},
{
"country": "USA",
"iso": "us",
"city": "New York",
"zone": "16"
},
{
"country": "USA",
"iso": "us",
"city": "San Francisco",
"zone": "54"
}
]`)
const res = Object.values(input.reduce((acc, el)=>{
if(!acc[el.country]){
acc[el.country] = {
label: el.country,
value: el.iso,
items: [
{
label: el.city,
value: el.zone
}
]
}
} else {
acc[el.country].items.push({
label: el.city,
value: el.zone
})
}
return acc;
}, {}))
console.log(res)
in few words:
create a Map like country -> object
for each element of the array, if in the map that country already exists, then just push the new element, otherwise create it

How to sort an object of objects in JavaScript?

I have an object of objects named teams:
{
"1": {
"number": "134C",
"robotName": "chazzen",
"name": "Team Discovery - Charlie",
"organization": "Pembroke Academy",
"city": "Pembroke",
"region": "New Hampshire",
"country": "United States"
},
"2": {
"number": "134G",
"robotName": "Ghammer Time",
"name": "Team discovery -Golf",
"organization": "Pembroke Academy",
"city": "Pembroke",
"region": "New Hampshire",
"country": "United States"
},
"3": {
"number": "134K",
"robotName": "Team Discovery kilo",
"name": "Team Discovery -Kilo",
"organization": "Pembroke Academy",
"city": "Pembroke",
"region": "New Hampshire",
"country": "United States"
},
"4": {
"number": "134E",
"robotName": "Team Discovery -Echo",
"name": "Team Discovery - Echo",
"organization": "Pembroke Academy",
"city": "Pembroke",
"region": "New Hampshire",
"country": "United States"
}
}
How do I sort these "sub-objects" alphabetically and numerically based on values such as "number" or "name" in a function?

Nested JSON iterate, Maximum call stack size exceeded

I have implemented a recursive function to iterate through a nested JSON. The issue I am facing is that it throws the error
Maximum call stack exceeded
The function that I implemented is as follows,
function createTreeMap (treeCatalog){
var _this = this;
_.each(treeCatalog, function (ele, inx){
if(typeof (ele) === "object"){
createTreeMap(ele);
}else{
//I create another JSON structure with the value as its property and its value as 1.
_this.treeMap[ele] = 1;
}
});
}
and the JSON I am iterating through looks something like this,
[{
"EmployeeID": 2,
"FirstName": "Andrew",
"LastName": "Fuller",
"Country": "USA",
"Title": "Vice President, Sales",
"HireDate": "1992-08-14 00:00:00",
"BirthDate": "1952-02-19 00:00:00",
"City": "Tacoma",
"Address": "908 W. Capital Way",
children: [{
"EmployeeID": 8,
"FirstName": "Laura",
"LastName": "Callahan",
"Country": "USA",
"Title": "Inside Sales Coordinator",
"HireDate": "1994-03-05 00:00:00",
"BirthDate": "1958-01-09 00:00:00",
"City": "Seattle",
"Address": "4726 - 11th Ave. N.E."
}, {
"EmployeeID": 1,
"FirstName": "Nancy",
"LastName": "Davolio",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1992-05-01 00:00:00",
"BirthDate": "1948-12-08 00:00:00",
"City": "Seattle",
"Address": "507 - 20th Ave. E.Apt. 2A"
}, {
"EmployeeID": 3,
"FirstName": "Janet",
"LastName": "Leverling",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1992-04-01 00:00:00",
"BirthDate": "1963-08-30 00:00:00",
"City": "Kirkland",
"Address": "722 Moss Bay Blvd."
}, {
"EmployeeID": 4,
"FirstName": "Margaret",
"LastName": "Peacock",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1993-05-03 00:00:00",
"BirthDate": "1937-09-19 00:00:00",
"City": "Redmond",
"Address": "4110 Old Redmond Rd."
}, {
"EmployeeID": 5,
"FirstName": "Steven",
"LastName": "Buchanan",
"Country": "UK",
"Title": "Sales Manager",
"HireDate": "1993-10-17 00:00:00",
"BirthDate": "1955-03-04 00:00:00",
"City": "London",
"Address": "14 Garrett Hill",
"expanded": "true",
children: [{
"EmployeeID": 6,
"FirstName": "Michael",
"LastName": "Suyama",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1993-10-17 00:00:00",
"BirthDate": "1963-07-02 00:00:00",
"City": "London",
"Address": "Coventry House Miner Rd."
}, {
"EmployeeID": 7,
"FirstName": "Robert",
"LastName": "King",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1994-01-02 00:00:00",
"BirthDate": "1960-05-29 00:00:00",
"City": "London",
"Address": "Edgeham Hollow Winchester Way"
},{
"EmployeeID": 9,
"FirstName": "Anne",
"LastName": "Dodsworth",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1994-11-15 00:00:00",
"BirthDate": "1966-01-27 00:00:00",
"City": "London",
"Address": "7 Houndstooth Rd."
}]
}]
}];
My suspicion is the similar child property names. But is there a proper way of fixing this as the similar child names is a requirement.
Thank you very much :)
UPDATE
this example simulates the issue I am having : http://jsfiddle.net/qaoapays/1/

After binding your source to jqxTreeGrid it a small change it structure: add parent property, and data property, where data - reference to self.
As workaround, to avoid infinite recursion you need miss this property, something like
function iterate (obj){
_.each(obj, function(ele, inx){
if(typeof (ele) === "object" && ele !== obj && inx !== 'parent'){
iterate(ele);
}else{
console.log(ele);
}
});
}
var employees =
[{
"EmployeeID": 2,
"FirstName": "Andrew",
"LastName": "Fuller",
"Country": "USA",
"Title": "Vice President, Sales",
"HireDate": "1992-08-14 00:00:00",
"BirthDate": "1952-02-19 00:00:00",
"City": "Tacoma",
"Address": "908 W. Capital Way",
children: [{
"EmployeeID": 8,
"FirstName": "Laura",
"LastName": "Callahan",
"Country": "USA",
"Title": "Inside Sales Coordinator",
"HireDate": "1994-03-05 00:00:00",
"BirthDate": "1958-01-09 00:00:00",
"City": "Seattle",
"Address": "4726 - 11th Ave. N.E."
}, {
"EmployeeID": 1,
"FirstName": "Nancy",
"LastName": "Davolio",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1992-05-01 00:00:00",
"BirthDate": "1948-12-08 00:00:00",
"City": "Seattle",
"Address": "507 - 20th Ave. E.Apt. 2A"
}, {
"EmployeeID": 3,
"FirstName": "Janet",
"LastName": "Leverling",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1992-04-01 00:00:00",
"BirthDate": "1963-08-30 00:00:00",
"City": "Kirkland",
"Address": "722 Moss Bay Blvd."
}, {
"EmployeeID": 4,
"FirstName": "Margaret",
"LastName": "Peacock",
"Country": "USA",
"Title": "Sales Representative",
"HireDate": "1993-05-03 00:00:00",
"BirthDate": "1937-09-19 00:00:00",
"City": "Redmond",
"Address": "4110 Old Redmond Rd."
}, {
"EmployeeID": 5,
"FirstName": "Steven",
"LastName": "Buchanan",
"Country": "UK",
"Title": "Sales Manager",
"HireDate": "1993-10-17 00:00:00",
"BirthDate": "1955-03-04 00:00:00",
"City": "London",
"Address": "14 Garrett Hill",
"expanded": "true",
children: [{
"EmployeeID": 6,
"FirstName": "Michael",
"LastName": "Suyama",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1993-10-17 00:00:00",
"BirthDate": "1963-07-02 00:00:00",
"City": "London",
"Address": "Coventry House Miner Rd."
}, {
"EmployeeID": 7,
"FirstName": "Robert",
"LastName": "King",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1994-01-02 00:00:00",
"BirthDate": "1960-05-29 00:00:00",
"City": "London",
"Address": "Edgeham Hollow Winchester Way"
}, {
"EmployeeID": 9,
"FirstName": "Anne",
"LastName": "Dodsworth",
"Country": "UK",
"Title": "Sales Representative",
"HireDate": "1994-11-15 00:00:00",
"BirthDate": "1966-01-27 00:00:00",
"City": "London",
"Address": "7 Houndstooth Rd."
}]
}]
}];
//// prepare the data
var source = {
dataType: "json",
dataFields: [{
name: 'EmployeeID',
type: 'number'
}, {
name: 'FirstName',
type: 'string'
}, {
name: 'LastName',
type: 'string'
}, {
name: 'Country',
type: 'string'
}, {
name: 'City',
type: 'string'
}, {
name: 'Address',
type: 'string'
}, {
name: 'Title',
type: 'string'
}, {
name: 'HireDate',
type: 'date'
}, {
name: 'children',
type: 'array'
}, {
name: 'expanded',
type: 'bool'
}, {
name: 'BirthDate',
type: 'date'
}],
hierarchy: {
root: 'children'
},
id: 'EmployeeID',
localData: employees
};
var dataAdapter = new $.jqx.dataAdapter(source);
// create Tree Grid
$("#treeGrid").jqxTreeGrid({
width: 680,
source: dataAdapter,
editable: true,
filterable: true,
theme: 'energyblue',
columns: [{
text: 'FirstName',
dataField: 'FirstName',
width: 150
}, {
text: 'LastName',
dataField: 'LastName',
width: 120
}, {
text: 'Title',
dataField: 'Title',
width: 200
}, {
text: 'Birth Date',
dataField: 'BirthDate',
cellsFormat: 'd',
width: 120
}, {
text: 'Hire Date',
dataField: 'HireDate',
cellsFormat: 'd',
width: 120
}, {
text: 'Address',
dataField: 'Address',
width: 250
}, {
text: 'City',
dataField: 'City',
width: 120
}, {
text: 'Country',
dataField: 'Country',
width: 120
}]
});
$("#jqxbutton").jqxButton({
theme: 'energyblue',
height: 30
});
$('#jqxbutton').click(function () {
$("#treeGrid").jqxTreeGrid('expandRow',2);
iterate(employees);
});
function iterate (obj){
_.each(obj, function(ele, inx){
if(typeof (ele) === "object" && ele !== obj && inx !== 'parent'){
iterate(ele);
}else{
console.log(ele);
}
});
}
<script src="http://documentcloud.github.io/underscore/underscore.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css" rel="stylesheet"/>
<link href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css" rel="stylesheet"/>
<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id="treeGrid"></div>
<input type="button" style="margin: 20px;" id="jqxbutton" value="Expand a row" />
Yet another way: pass to source - deep cloned object

Hasitha, I think you are putting the object you are cataloging ("ele") back into the function itself.
instead of
createTreeMap(ele);
try something like this
createTreeMap(ele.child);

Develop Reference

JavaScript is the programming language of the Web.

Convert nested JSON array into flat JSON array - javascript

Related

Convert row-data to sunburst chart data for Highcharts library

Comparing 2 arrays of nested objects while ignoring some properties in Javascript

Javascript grouping [closed]

How to sort an object of objects in JavaScript?

Nested JSON iterate, Maximum call stack size exceeded

Categories

Resources