How to segregate the JSON response I'm getting

Question

{
  "Data": [{
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": "TimeStamp1"
    },
    {
      "Rsrc": "Oracle",
      "status": "0",
      "TimeStamp": "TimeStamp1"
    },
    {
      "Rsrc": "Oracle",
      "status": "100",
      "TimeStamp": "TimeStamp2"
    },
    {
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": "TimeStamp2"
    }
  ]
}

(Where TimeStamp1 andTimeStamp2 are valid time stamps)

I'm getting the above data using a Rest Service. I need to Showcase it in a different manner. Have to convert it this way that I'll get the response in 2 variables called

Category = [TimeStamp1,TimeStamp2]

and

Data=  [{
  name: 'DB',
  data: [100, 100]
}, {
  name: 'Oracle',
  data: [0, 100]
}]

Thanks in Advance

why do you want to plot a timeseries data as categorical chart? The true essence of the chart will be lost if you do that way. — Strikers, Jul 19 '17 at 06:39

score 1 · Answer 1 · answered Jul 19 '17 at 06:45

The first one is easy, just map the data array to one containing only the timestamps and pipe it into a Set

const Category = Array.from(new Set(obj.Data.map(datum => datum.TimeStamp)))

The second will require you to reduce the data to a map of Rsrc to a status array which you can then transform into an array

const obj = {"Data":[{"Rsrc":"DB","status":"100","TimeStamp":"TimeStamp1"},{"Rsrc":"Oracle","status":"0","TimeStamp":"TimeStamp1"},{"Rsrc":"Oracle","status":"100","TimeStamp":"TimeStamp2"},{"Rsrc":"DB","status":"100","TimeStamp":"TimeStamp2"}]}

const Data = Array.from(obj.Data.reduce((map, datum) => {
  let data = map.get(datum.Rsrc) || []
  return map.set(datum.Rsrc, data.concat(datum.status))
}, new Map())).map(entry => ({
  name: entry[0],
  data: entry[1]
}))

console.info('Data', Data)

sauntimo · Answer 2 · 2017-07-19T06:48:08.777

0

I looped over your data and built the two new arrays. I used a third rsrc array to help to determine which position in the data array to add new items too.

var test = {
  "Data": [{
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": 'TimeStamp1'
    },
    {
      "Rsrc": "Oracle",
      "status": "0",
      "TimeStamp": 'TimeStamp1'
    },
    {
      "Rsrc": "Oracle",
      "status": "100",
      "TimeStamp": 'TimeStamp2'
    },
    {
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": 'TimeStamp2'
    }
  ]
};

var category = [];
var data = [];
var rsrc = [];

test['Data'].forEach(function( item ){
  
  if( category.indexOf( item['TimeStamp'] ) === -1 ){
    category.push( item['TimeStamp'] );
  }
  
  if( rsrc.indexOf( item[ 'Rsrc' ] ) === -1 ){
   rsrc.push( item[ 'Rsrc' ] ); 
  }
  
  var pos = rsrc.indexOf( item[ 'Rsrc' ] );
  
  // set as itself or an object if it's not yet been set
  data[pos] = data[pos] || {};
  data[pos].name = item[ 'Rsrc' ];
  data[pos].data = data[pos].data || [];
  data[pos].data.push( item.status );

});

console.log( category );
console.log( data );

Edit fixed issue with repeated categories, thanks to @yashgarg1232

edited Jul 19 '17 at 06:48

answered Jul 19 '17 at 06:34

sauntimo

1,531
1
17
28

There exists a problem with this code, the category will have duplicates, as before inserting there is no check for exists. Possibly consider using `map`. – o12d10 Jul 19 '17 at 06:37
@yashgarg1232 which item are you referring to as the category? if you look at the output, isn't it what the OP asked for? – sauntimo Jul 19 '17 at 06:41
1

Your answer will return `Category = [Timestamp1, Timestamp1, Timestamp2, Timestamp2]`, while the expect output is `Category =[Timestamp1, Timestamp2]` – o12d10 Jul 19 '17 at 06:44
@yashgarg1232 ah yes, you're right - sorry I had missunderstood that in the question. Thanks! – sauntimo Jul 19 '17 at 06:49
glad I could help. It happens. – o12d10 Jul 19 '17 at 06:50

score 0 · Answer 3 · answered Jul 19 '17 at 06:46

var input ={
  "Data": [{
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": "TimeStamp1"
    },
    {
      "Rsrc": "Oracle",
      "status": "0",
      "TimeStamp": "TimeStamp1"
    },
    {
      "Rsrc": "Oracle",
      "status": "100",
      "TimeStamp": "TimeStamp2"
    },
    {
      "Rsrc": "DB",
      "status": "100",
      "TimeStamp": "TimeStamp2"
    }
  ]
};
var data= input.Data;
var Category =[];
var Data =[];
var DataIndex = [];
data.forEach(function(i)
{
    if(Category.indexOf(i.TimeStamp)==-1) Category.push(i.TimeStamp);
    var idx=DataIndex.indexOf(i.Rsrc)
    if(idx==-1) {
        DataIndex.push(i.Rsrc);
        Data.push({name:i.Rsrc,data:[i.status]});
    } else {
         Data[idx].data.push(i.status);
    }
});

console.log(Category);
console.log(Data);

How to segregate the JSON response I'm getting

3 Answers3