ロダッシュを使用したピボットデータ

Question

init配列を、好ましくはlodashを使用して最終配列に変換する必要があります。

initArray = [ 
    { 
     "date":"2017-08-15", 
     "data":[ 
     { 
      "color":"orange", 
      "count":100 
     }, 
     { 
      "color":"green", 
      "count":101 
     } 
     ] 
    }, 
    { 
     "date":"2017-08-14", 
     "data":[ 
     { 
      "color":"orange", 
      "count":102 
     }, 
     { 
      "color":"green", 
      "count":103 
     } 
     ] 
    } 
] 

finalArray = [ 
    { 
     "color":"orange", 
     "data":[ 
     100, 
     102 
     ] 
    }, 
    { 
     "color":"green", 
     "data":[ 
     101, 
     103 
     ] 
    } 
] 

Answer 1

reduceを使用すると、すべてのデータ配列が同じレベルになるように元の配列を平坦化することができます。その後、_.transformを使用して、色をそれらのカウントの配列にマッピングする一時オブジェクトを取得します。 forEachを使用してfinalArrayにプッシュすることができます。

var initArray = [ 
 
    { 
 
    "date":"2017-08-15", 
 
    "data":[ 
 
    { 
 
     "color":"orange", 
 
     "count":100 
 
    }, 
 
    { 
 
     "color":"green", 
 
     "count":101 
 
    } 
 
    ] 
 
    }, 
 
    { 
 
    "date":"2017-08-14", 
 
    "data":[ 
 
    { 
 
     "color":"orange", 
 
     "count":102 
 
    }, 
 
    { 
 
     "color":"green", 
 
     "count":103 
 
    } 
 
    ] 
 
    } 
 
]; 
 
var finalArray = []; 
 
var temp = _.transform(initArray.reduce((a,b) => a.data.concat(b.data)), 
 
         (r, v) => (r[v.color] || (r[v.color] = [])).push(v.count), {}); 
 

 
_.forEach(temp, (v,k) => finalArray.push({color:k, count:v})); 
 

 
console.log(finalArray);

<script src="https://cdn.jsdelivr.net/lodash/4/lodash.min.js"></script>

Answer 2

lodashコールは、私には意味をなさないようにこのように思えます。

// var _ = require('lodash') 
 

 
initArray = [ 
 
    { 
 
     "date":"2017-08-15", 
 
     "data":[ 
 
     { 
 
      "color":"orange", 
 
      "count":100 
 
     }, 
 
     { 
 
      "color":"green", 
 
      "count":101 
 
     } 
 
     ] 
 
    }, 
 
    { 
 
     "date":"2017-08-14", 
 
     "data":[ 
 
     { 
 
      "color":"orange", 
 
      "count":102 
 
     }, 
 
     { 
 
      "color":"green", 
 
      "count":103 
 
     } 
 
     ] 
 
    } 
 
] 
 

 
result = _(initArray) 
 
    //.map('data') 
 
    //.flatten() 
 
    .flatMap('data') // instead of .map('data').flatten() 
 
    .groupBy('color') 
 
    .map((item, key) => ({ 
 
     color: key, 
 
     count: _.map(item, 'count') 
 
    })) 
 
    .value() 
 

 
console.log(result)

<script src="https://cdn.jsdelivr.net/lodash/4/lodash.min.js"></script>