We Keep Coding

How to parse a JSON (Google Analytics API 4)

I have an API response in form of JSON.
"reports": [
{
"columnHeader": {
"dimensions": [
"ga:date"
],
"metricHeader": {
"metricHeaderEntries": [
{
"name": "ga:sessions",
"type": "INTEGER"
},
{
"name": "ga:users",
"type": "INTEGER"
}
]
}
},
"data": {
"rows": [
{
"dimensions": [
"20210623"
],
"metrics": [
{
"values": [
"13",
"13"
]
}
]
},
{
"dimensions": [
"20210624"
],
"metrics": [
{
"values": [
"18",
"16"
]
}
]
}
]}}]}
I need to get each metric (metricHeaderEntries) with its values in a separate Object, which is therefore is in an array "dataTracesAll".
//Example of the construction
//dataTracesAll is an array, containing objects with key "trace" + int
dataTracesAll['trace' + (i+1)] = {
name: metricsTitles[i].name, //metric title "sessions"
x: dimensions, //list of dimensions ["20210623", "20210624"]
y: dataClear //list of metrics for each metrics is separate ["13", "18"]
}
//The full code:
var titles = [];
var dataTracesAll = [];
//raw data
for (var i=0; i < data.reports.length; i++) {
//get titles
var metricsTitles = data.reports[i].columnHeader.metricHeader.metricHeaderEntries;
metricsTitles.forEach(function(title) {
titles.push(title.name.split("ga:")[1]);
});
//values and dates raw
var dimensions = [];
var dataClear = [];
var values = data.reports[i].data.rows;
//get dates and values
values.forEach(function(val) {
dimensions.push(val.dimensions[0]);
dataClear.push(val.metrics[0].values[0]); //only the first array value is added
});
//clear values
console.log(values);
//constuct array with values
dataTracesAll['trace' + (i+1)] = {
name: metricsTitles[i].name,
x: dimensions,
y: dataClear
}
}
Result of the code:
The problem is that it adds only the first value of the metrics value array and I cannot get how to parse everything, so there is actually 2 traces.
My ideal result is:
dataTracesAll = [
trace1: {
name: "ga:sessions",
x: ['20210623', '20210624']
y: ['13', '18']
},
trace2: {
name: "ga:users",
x: ['20210623', '20210624']
y: ['13', '16']
}
];

Try this:
var data = {"reports": [
{
"columnHeader": {
"dimensions": [
"ga:date"
],
"metricHeader": {
"metricHeaderEntries": [
{
"name": "ga:sessions",
"type": "INTEGER"
},
{
"name": "ga:users",
"type": "INTEGER"
}
]
}
},
"data": {
"rows": [
{
"dimensions": [
"20210623"
],
"metrics": [
{
"values": [
"13",
"13"
]
}
]
},
{
"dimensions": [
"20210624"
],
"metrics": [
{
"values": [
"18",
"16"
]
}
]
}
]}}]};
var titles = [];
var dataTracesAll = [];
var length = data.reports[0].data.rows[0].metrics[0].values.length;
//raw data
for (var i=0; i < length; i++) {
//get titles
var metricsTitles = data.reports[0].columnHeader.metricHeader.metricHeaderEntries;
metricsTitles.forEach(function(title) {
titles.push(title.name.split("ga:")[1]);
});
//values and dates raw
var dimensions = [];
var dataClear = [];
var values = data.reports[0].data.rows;
//get dates and values
values.forEach(function(val) {
dimensions.push(val.dimensions[0]);
dataClear.push(val.metrics[0].values[i]);
});
//constuct array with values
dataTracesAll.push({});
dataTracesAll[i]['trace' + (i+1)] = {
name: metricsTitles[i].name,
x: dimensions,
y: dataClear
}
}
console.log(dataTracesAll);
Edit: The result was supposed to be an array, so I changed the code accordingly.

I have updated you logic to make it fit for your requirement. Hope this will work.
const data =
{
"reports": [
{
"columnHeader": {
"dimensions": [
"ga:date"
],
"metricHeader": {
"metricHeaderEntries": [
{
"name": "ga:sessions",
"type": "INTEGER"
},
{
"name": "ga:users",
"type": "INTEGER"
}
]
}
},
"data": {
"rows": [
{
"dimensions": [
"20210623"
],
"metrics": [
{
"values": [
"13",
"13"
]
}
]
},
{
"dimensions": [
"20210624"
],
"metrics": [
{
"values": [
"18",
"16"
]
}
]
}
]
}
}]
}
const dataTracesAll = {};
const report = data.reports[0];
for (var i = 0; i < report.data.rows.length; i++) {
dataTracesAll[`trace${i + 1}`] = {
name: report.columnHeader.metricHeader.metricHeaderEntries[i].name,
x: [],
y: [],
}
}
Object.keys(dataTracesAll).forEach((key, index) => {
for (var i = 0; i < report.data.rows.length; i++) {
dataTracesAll[key].x.push(report.data.rows[i].dimensions[0]);
dataTracesAll[key].y.push(report.data.rows[i].metrics[0].values[index]);
}
})
console.log(dataTracesAll);

How to convert data structure to another tree structure

I need your help for create a tree like data structure with given JSON as shown below and required output structure already given below. I am a beginner in programming and I have only a little knowledge in data structure
JSON from API
[
"",
[
"Test",
[
"Test/sample",
[
"Test/sample/sample1"
]
],
[
"Test/test3"
]
],
[
"Test1",
[
"Test1/test2"
]
],
[
"cat"
]
]
Output like below structure
{
"key": "Image",
"label": "Image",
"icon": 'pi pi-folder',
"children": []
},
{
"key": "Test",
"label": "Test",
"icon": "pi pi-folder",
"children": [
{
"key": "Test/sample",
"label": "Sample",
"icon": "pi pi-folder",
"children": [{
"key": "Test/sample/sample1",
"label": "Sample1",
"icon": 'pi pi-folder',
"children": []
}]
},
{
"key": "Test/test3",
"label": "test3",
"icon": "pi pi-folder",
"children": []
},
]
},
{
"key": "Test1",
"label": "Test1",
"icon": "pi pi-folder",
"children": [{
"key": "Test1/test2",
"label": "test2",
"icon": "pi pi-folder",
"children": []
}]
},
{
"key": "cat",
"label": "cat",
"icon": "pi pi-folder",
"children": []
},
]
Above structure is image file directory and directory name is indicated by label and icon is indicating directory, children show sub directory
Console value of API

It can easily archive with recursive function
const icon = "pi pi-folder";
var a = [
"",
[
"Test",
[
"Test/sample",
[
"Test/sample/sample1"
]
],
[
"Test/test3"
]
],
[
"Test1",
[
"Test1/test2"
]
],
[
"cat"
]
]
/**
* #param {Array} arr The child array
*/
function createChildNode(arr) {
let key = "Image";
let label = "Image";
let children = [];
if (arr.length >= 1) {
key = arr[0];
label = key.includes("/") ? key.split("/").pop() : key;
label = label.charAt(0).toUpperCase() + label.slice(1);
for (let index = 1; index < arr.length; index++) {
const element = arr[index];
children.push(createChildNode(element));
}
}
return {key: key, label: label, icon: icon, children: children};
}
var b = []
for (let index = 0; index < a.length; index++) {
const element = a[index];
b.push(createChildNode(element));
}
console.log(b);

Error in generating a valid json recursive javascript function

I have a function to generate an object which I'm transforming to a JSON later on:
function createSearchCriteria(payload) {
var output = [];
if (payload['searchCriteria'] != null) {
for (var i = 0; i < payload['searchCriteria'].length; i++) {
var content = payload['searchCriteria'][i];
output[i] = {};
if (content['grouping'] != null) {
output[i]['groupOperator'] = content['grouping'];
output[i]['searchCriteria'] = [];
output[i]['searchCriteria'].push(createSearchCriteria(content))
} else {
output[i]['name'] = content['name'];
output[i]['type'] = content['type'];
}
}
}
return output
}
The input payload for this method is also a JSON value parsed
payload = JSON.parse(request);
The input structure is almost the same as the output, the only difference is the "grouping" attribute, which in the output is called "groupOperator".
I have implemented my function recursive because we can have different levels of search criteria.
Even though the searchCriteria in the input has only one [] each.
Why does each searchCriteria in the result comes with 2 pairs of squared brackets?
{
"searchCriteria": [
{
"groupOperator": "AND",
"searchCriteria": [
[
{
"groupOperator": "OR",
"searchCriteria": [
[
{
"name": "FirstName",
"type": "string"
},
{
"name": "LastName",
"type": "string"
},
{
"name": "MiddleName",
"type": "string"
},
{
"name": "Document",
"type": "string"
},
{
"name": "DOB",
"type": "date"
},
{
"name": "CdrId",
"type": "string"
}
]
]
},
{
"groupOperator": "AND",
"searchCriteria": [
[
{
"name": "Active",
"type": "bool"
},
{
"name": "Id",
"type": "int"
},
{
"name": "CountryId",
"type": "int"
}
]
]
}
]
]
}
],
"groupOperator": "AND"
}
Thanks in advance for your help.

try
output[i]['searchCriteria'] = createSearchCriteria(content)
instead of
output[i]['searchCriteria'] = [];
output[i]['searchCriteria'].push(createSearchCriteria(content))

JavaScript: Solving an algorithmic problem

Today I was working on a problem, which states as follows:
Problem:
INPUT: [{..}, {..}, ..] Array of objects;
Each object is has {"id": required, "children": []}
The objects has parent-child relation based on "id" and "children" props
OUTPUT: [{..}, {..}, ..] Array in a tree (hierarchy) order :multi-level.
Input:
[{
"id": 1,
"name": "Earth",
"children": [2, 3]
}, {
"id": 2,
"name": "Asia",
"children": []
}, {
"id": 3,
"name": "Europe",
"children": [4]
}, {
"id": 4,
"name": "Germany",
"children": [5]
}, {
"id": 5,
"name": "Hamburg",
"children": []
}]
OutPut
[{
"id": 1,
"name": "Earth",
"children": [{
"id": 2,
"name": "Asia",
"children": []
}, {
"id": 3,
"name": "Europe",
"children": [{
"id": 4,
"name": "Germany",
"children": [{
"id": 5,
"name": "Hamburg",
"children": []
}]
}]
}]
}]
My approach
I decided to solve this by iterating through each element in the array and recursively find and append objects to children of each element.
So just to start with, I decided to have only First level children appended their respective parents. And my code is following.
var posts = [{"id":1,"name":"Earth","children":[2,3]},{"id":2,"name":"Asia","children":[]},{"id":3,"name":"Europe","children":[4]},{"id":4,"name":"Germany","children":[5]},{"id":5,"name":"Hamburg","children":[]}]
function getElementById (id, posts) {
for(var i =0; i< posts.length; i++){
if(posts[i].id === id){
var found = posts[i];
///// FUN here -> //// posts.splice(i, 1);
return found;
}
}
}
function refactorChildren(element, posts) {
if(!element.children || element.children.length === 0) {
return element;
}
var children = [];
for(var i = 0; i < element.children.length; i++){
var childElement = getElementById(element.children[i], posts);
children.push(childElement);
}
element.children = children;
return element;
}
function iterate(posts) {
var newPosts = [];
var des = [...posts]
for(var i = 0; i < des.length; i++){
var childedElement = refactorChildren(des[i], des);
newPosts.push(childedElement);
}
return newPosts;
}
var filtered = iterate(posts);
console.log(JSON.stringify(filtered))
Surprisingly above code Solves the ACTUAL PROBLEM (except a lil bit of more work)
My Expected Result should be the following: Array of objects with only First level children
[{
"id": 1,
"name": "Earth",
"children": [{
"id": 2,
"name": "Asia",
"children": []
}, {
"id": 3,
"name": "Europe",
"children": [4]
}]
}, {
"id": 4,
"name": "Germany",
"children": [{
"id": 5,
"name": "Hamburg",
"children": []
}]
}]
And I do get the above result if I uncomment the ///// FUN here -> //// line. Which is erasing the iterating object on the go.
So my problem is
I want to know - HOW DID? All the objects got appended correctly to their respective Parent objects by that code? My next step was to add a recursion call to the function refactorChildren(with-childElement).
AND
How did, just by adding posts.splice(i, 1); got me MY expected result from the code?
Please help me understand, I just cant go ahead without knowing "HOW".
Thanks

While traversing the objects, you recursively call a function on all its chilfren and remove the objects from the array:
[
{ id: 1, children: [2], }, // < iterator
{ id: 2, children: [] }, // < gets spliced out recursively
]
If a child is in the array before its parent however, this won't work as you copy the child into another array before the parent gets visited.

Maybe you are interested in a different approach with only a single loop for getting the parent elements and their children.
This works for unsorted data, too.
var data = [{ id: 1, name: "Earth", children: [2, 3] }, { id: 2, name: "Asia", children: [] }, { id: 3, name: "Europe", children: [4] }, { id: 4, name: "Germany", children: [5] }, { id: 5, name: "Hamburg", children: [] }],
tree = function (array) {
var r = {},
children = new Set,
result = [];
array.forEach(o => {
Object.assign(
r[o.id] = r[o.id] || {},
o,
{ children: o.children.map(id => (children.add(id), r[id] = r[id] || {})) }
);
});
return Object.values(r).filter(({ id }) => !children.has(id));
}(data);
console.log(tree);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Remove duplicate keys of JSON object in javascript to structure JSON differently

I'm trying to change the structure of a json by removing duplicate keys. Otherwise, to put the children of a same name inside only one name node.
Current JSON:
{
"name": "flare",
"children": [
{
"name": "analytics",
"children": [
{
"name": "cluster",
"children": [
{
"name": "AgglomerativeCluster",
"size": [
"3938"
]
}
]
}
]
},
{
"name": "analytics",
"children": [
{
"name": "cluster",
"children": [
{
"name": "CommunityStructure",
"size": [
"3812"
]
}
]
}
]
}
]
}
Desired output:
{
"name": "flare",
"children": [
{
"name": "analytics",
"children": [
{
"name": "cluster",
"children": [
{
"name": "AgglomerativeCluster",
"size": 3938
},
{
"name": "CommunityStructure",
"size": 3812
}
]
}
]
}
]
};
Thanks for your help.

Typically, StackOverflow isn't the place to have people write code for you, and your question should be more specific as to with what part of your algorithm you are having trouble. However, this looked fun, so I did it.
I solved this by first converting it to an object whose properties are the names and values are the children/size. This insured that each named instance was grouped with other named instances.
var mutate = function(desired, current) {
for (var x = 0; x < current.length; x++) {
if (Object.hasOwnProperty.call(current[x], 'size')) {
desired[current[x].name] = parseInt(current[x].size[0], 10);
}
else {
if (!Object.hasOwnProperty.call(desired, current[x].name)) {
desired[current[x].name] = Object.create(null);
}
mutate(desired[current[x].name], current[x].children);
}
}
return desired;
};
I then converted that back to your original desired format by iterating over the Object.entries (key/value pairs).
var mutate2 = function(current) {
var desired = [];
var entries = Object.entries(current);
for (var x = 0; x < entries.length; x++) {
var o = Object.create(null);
o.name = entries[x][0];
if (typeof entries[x][1] === 'number') {
o.size = entries[x][1];
}
else {
o.children = mutate2(entries[x][1]);
}
desired.push(o);
}
return desired;
};
You get your result by using this hideous beast:
var desiredJson = mutate2(mutate(Object.create(null), [ currentJson ]));
console.log(desiredJson);