title: How to transform Javascript Object based on one of the column?
body: <p>I am really struggling with the Object transformation. I have an array of Object and want to transform it into Highcharts multi line chart input.</p>
  <ol>
  <li>For x-axis i need a object of unique dates.</li>
  <li>For Y -axis i need a series of objects, each will have equal number of points as unique dates from step 1. For a ID and date if data is available it will add that value otherwise null.</li>
  </ol>
  <p>Original:</p>
  <pre><code>[{
      &quot;date&quot;: &quot;1997-09-29&quot;,
      &quot;Count&quot;: 100,
      &quot;ID&quot;: &quot;AB12-R&quot;
    },
    {
      &quot;date&quot;: &quot;1997-12-30&quot;,
      &quot;Count&quot;: 104.7,
      &quot;ID&quot;: &quot;AB13-R&quot;
    },
    {
      &quot;date&quot;: &quot;1997-12-30&quot;,
      &quot;Count&quot;: 1192,
      &quot;ID&quot;: &quot;BA12-R&quot;
    },
  
    {
      &quot;date&quot;: &quot;1998-03-30&quot;,
      &quot;Count&quot;: 981,
      &quot;ID&quot;: &quot;BA12-R&quot;
    },
    {
      &quot;date&quot;: &quot;1998-06-01&quot;,
      &quot;Count&quot;: 341,
      &quot;ID&quot;: &quot;BA12-R&quot;
    }
  ]
  </code></pre>
  <p>Output:</p>
  <pre><code>[
    {
      Identiy: 'AB12-R',
      data: [100, null, null, null]
    },
    {
      Identiy: 'AB13-R',
      data: [null, 104.7, null, null]
    }, {
      Identiy: 'BA12-R',
      data: [null, 1192, 981, 341]
    }
  ]
  </code></pre>
  <p>Explanation:</p>
  <p>In Original i have 4 unique dates, Hence the length of data for each identity is 4. Now for each unique date i'll check if there is any entry in Original if yes i'll push it in data if not that null.</p>
  <p>My Code:</p>
  <p>From some help from, this is what i was trying. But this is not checking the unique dates and just creating the data object length which is equal to number of object in the Original. Here is that implementation <a href="https://jsfiddle.net/3u9penko/" rel="nofollow noreferrer">https://jsfiddle.net/3u9penko/</a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const data = [{"date":"1997-09-29","Count":100,"ID":"AB12-R"},{"date":"1997-12-30","Count":104.7,"ID":"AB13-R"},{"date":"1997-12-30","Count":1192,"ID":"BA12-R"},{"date":"1998-03-30","Count":981,"ID":"BA12-R"},{"date":"1998-06-01","Count":341,"ID":"BA12-R"}];
  
  const hcData = [];
  
  data.forEach((d, i) =&gt; {
  
    const checkIfExist = hcData.find(data =&gt; data.id === d["ID"])
  
    if (checkIfExist) {
      checkIfExist.data[i] = d["Count"];
    } else {
      const initialData = [...Array(data.length)]
      initialData.fill(null, 0, data.length)
  
      initialData[i] = d["Count"];
      hcData.push({
        data: initialData,
        id: d["ID"]
      })
    }
  })
  
  console.log(hcData)</code></pre>
  </div>
  </div>
  </p>