JSFiddle - React, Tailwind, and code Playground

by Kabeer Rifaye

JavaScript

var jsonData = [
  //1477000072
  //1476540906
  {
    "values": [
      {
        "x": 1477000072,
        "y": 1
      },
      {
        "x": 1476628213,
        "y": 1
      },
      {
        "x": 1476628212,
        "y": 0
      }
    ],
    "key": "500",
    "color": "red"
  },
  {
    "values": [
      {
        "x": 1477000072,
        "y": 1
      }
    ],
    "key": "501",
    "color": "green"
  },
  {
    "values": [
      {
        "x": 1477000150,
        "y": 1
      },
      {
        "x": 1476825082,
        "y": 0
      },
      {
        "x": 1476824711,
        "y": 1
      },
      {
        "x": 1476824702,
        "y": 0
      },
      {
        "x": 1476628214,
        "y": 1
      },
      {
        "x": 1476628212,
        "y": 0
      }
    ],
    "key": "502",
    "color": "black"
  },
  {
    "values": [
      {
        "x": 1477000072,
        "y": 1
      }
    ],
    "key": "503",
    "color": "blue"
  }
];

// console.log("data",jsonData);
// jsonData.forEach(function(d){
//   console.log(d);
// });
// console.log(Object.keys(jsonData).length);

// length of an object in an array
// var count = 0;
// for (i in jsonData) {
//     if (jsonData.hasOwnProperty(i)) {
//         count++;
//     }
// }
// console.log(count);

var timeStampForOne = 1477000072,
    timeStampForZero = 1476540906,
    obj,
    alteredValues,
    finalResult = [];
jsonData.forEach(function (d) {  
  switch(d.color) {
    case "red":
      alteredValues = [];
      obj = {
        color: d.color,
        key: d.key,
        values : alteredValues
      }
      d.values.forEach(function(data) {
        if(data.y === 1)
          alteredValues.push({
            "x" : timeStampForOne,
            "y" : data.y 
          });
        else
          alteredValues.push({
            "x" : timeStampForZero,
            "y" : data.y
          });
      });
      break;
    case "green":
      alteredValues = [];
      obj = {
        color: d.color,
        key:...