JSFiddle - React, Tailwind, and code Playground
by Castrolol
JavaScript
var data = [
{country :"America", city:"Kansas", employe:'Jacob', car: 'monza'},
{country :"America", city:"Kansas", employe:'Jacob', car: 'jaguar'},
{country :"Pakistan", city:"Lahore", employe:'tahir', car: 'fiat'},
{country :"Pakistan", city:"Islamabad", employe:'fakhar', car: 'citroen'} ,
{country :"Pakistan", city:"Islamabad", employe:'fakhar', car: 'ferrari'} ,
{country :"Pakistan", city:"Islamabad", employe:'fakhar', car: 'cruize'} ,
{country :"Pakistan", city:"Lahore", employe:'bilal', car: 'montana'},
{country :"India", city:"d", employe:'ali', car: 'beatle'} ,
{country :"India", city:"d", employe:'ali', car: 'fiat 147'} ,
{country :"India", city:"d", employe:'ali', car: 'strada'} ,
{country :"Pakistan", city:"Karachi", employe:'eden', car: 'BMW'},
{country :"Pakistan", city:"Karachi", employe:'eden', car: 'Porsche'},
{country :"America", city:"Kansas", employe:'Jeen', car: 'Voyage'} ,
{country :"India", city:"Banglore", employe:'PP', car:'asttra'} ,
{country :"India", city:"Banglore", employe:'JJ', car: 'Cherry'}
];
function groupByLevel( source, levels, config ){
config = ( typeof config == "object" && config ) || {};
var internalConfig = {
keyName: config.keyName || "name",
collectionName: config.collectionName || "children"
};
var hierarchy = {};
hierarchy[internalConfig.keyName] = "Hierarchy";
hierarchy[internalConfig.collectionName] = source;
var sourceArray = [hierarchy];
for(var i = 0; i < levels.length; i++){
var newSourceArray = [];
for(var j = 0; j < sourceArray.length; j++){
var oldArray = sourceArray[j][internalConfig.collectionName];
var newArray = groupBy(oldArray, levels[i], internalConfig);
sourceArray[j][internalConfig.collectionName] = newArray;
for(var l = 0; l < newArray.length; l++){
newSourceArray.push(newArray[l]);
}
}
sourceArray = newSourceArray;
}
return...