首页 > 解决方案 > d3 堆栈的数据转换

问题描述

我正在尝试重新组织我的数据以使用 d3 堆栈生成器运行。下面的代码可以工作,但会产生重复,看起来很啰嗦。有没有更好的方法来实现这种转变?

   From: data  = {code: "sjp", year: 2020, credit: 12},
    {code: "sjp", year: 2019, credit: 18},
    {code: "sjp", year: 2018, credit: 10},
    {code: "anp", year: 2020, credit: 16},
    {code: "anp", year: 2019, credit: 14},
    {code: "anp", year: 2018, credit: 12}


  To: data = {code: "sjp" , y2020: 12, y2019: 18, y2018: 10},
   {code: "anp" , y2020: 16, y2019: 14, y2018: 12}


keyz = d3.map(d, function(s){return(s.code)})
  
keyz.forEach(function (d) {
  var item = d.filter(function (e) { return e.code === d})
    
  for (var i = 0; i < item.length; i++) {
               switch(d[i].year) {
                       case "2020":              
                           y2020 = item[i].credit
                           break;
                       case "2019":                
                           y2019 = item[i].credit
                           break;
                       case "2018":          
                           y2018 = item[i].credit 
               }                     
     }                                          
  
     Newarray.push({"code": d, "y2020": y2020,"y2019":y2019, "y2018": y2018, "y2017":y2017, "y2016": y2016, "y2015":y2015})

标签: d3.js

解决方案


怎么样:

<!DOCTYPE html>
<html>
    <script>
       let data  = [{code: "sjp", year: 2020, credit: 12},
          {code: "sjp", year: 2020, credit: 12},
          {code: "sjp", year: 2019, credit: 18},
          {code: "sjp", year: 2019, credit: 18},
          {code: "sjp", year: 2018, credit: 10},
          {code: "sjp", year: 2018, credit: 10},
          {code: "anp", year: 2020, credit: 16},
          {code: "anp", year: 2020, credit: 16},
          {code: "anp", year: 2019, credit: 14},
          {code: "anp", year: 2019, credit: 14},
          {code: "anp", year: 2018, credit: 12}];

      let obj = {};  // create a "dictionary" object
      data.forEach(function(d){ // loop the data
        if (!obj[d.code]) obj[d.code] = {code: d.code}; // see if the "code" key exists in the dictionary yet, if not add it
        if (!obj[d.code]['y' + d.year]) obj[d.code]['y' + d.year] = 0; // first time we see year initialize to 0;
        obj[d.code]['y' + d.year] += d.credit; // retrieve the dictionary value for this code and year and add value
      })
      console.log(Object.values(obj)); // get just the values of our dictionary as an array
    </script>
  </body>
</html>


推荐阅读