按组查找最新的日期和输出值

时间:2018-02-09 22:17:17

标签: javascript html json d3.js

我想仅为每个组显示最新值。

下面的CSV示例:Cinnamon Raisin品种的百吉饼总量在三个单独的采样期间收集:2017年5月,2017年3月和2016年11月,其数量分别为:300,100和20。

我已经把年份和月份合并,然后将它们转换为数字格式,这样我就可以使用d3.max找到最近的(最高)值。最高的是42856(2017年5月),但我想显示金额(300)而不是d3.max金额。

breakfastItem,gluten,breakfastItemType,month,year,dateCode,value
Bagel,Yes,Cinnamon Raisin,May,2017,42856,300
Bagel,Yes,Cinnamon Raisin,March,2017,42795,100
Bagel,Yes,Cinnamon Raisin,November,2016,42675,20
Bagel,Yes,Blueberry,February,2017,42767,50
Bagel,Yes,Blueberry,November,2016,42675,30
Bagel,Yes,Blueberry,March,2016,42430,100
Bagel,Yes,Plain,February,2018,43132,200
Bagel,Yes,Plain,December,2017,43070,202
Bagel,Yes,Plain,February,2016,42401,201

这是我的Javascript:

d3.csv("Breakfast.csv",function(data) {
        data.forEach(function(d){
            d.value = +d.value;
            d.year = +d.year;
            d.dateCode = +d.dateCode;
        });

        var breakfastCombinations = d3.nest()
        .key(function(d) {return d.breakfastItem; })
        .key(function(d) {return d.breakfastItemType; })
        .rollup(function(oldestDate) { 
            return d3.max(oldestDate, function(d) {
                return d.dateCode; });
            })
        .entries(data);
        document.getElementById("breakfastjson").innerHTML = JSON.stringify(breakfastCombinations,false,2); 

    });

将我的JSON弹出

 {
    "key": "Bagel",
    "values": [
      {
        "key": "Cinnamon Raisin",
        "value": 42856
      },
      {
        "key": "Blueberry",
        "value": 42767
      },
      {
        "key": "Plain",
        "value": 43132
      }
    ]
  }

但我希望“值”是该类型百吉饼的总量,而不是dateCode。像这样:

  {
    "key": "Bagel",
    "values": [
      {
        "key": "Cinnamon Raisin",
        "value": 300
      },
      {
        "key": "Blueberry",
        "value": 50
      },
      {
        "key": "Plain",
        "value": 200
      }
    ]
  }

我想使用这个dateCode来识别要显示的信息,包括很多不同的信息(如月,年等)。我尝试过如下组合:

        .rollup(function(oldestDate) { 
        return d3.max(oldestDate, function(d) {
            return d.dateCode; }).value;
        })

        .rollup(function(oldestDate) { 
        return d3.max(oldestDate, function(d) {
            return d.dateCode.value; });
        })

但我似乎无法找到正确的语法来显示它。救命啊!

1 个答案:

答案 0 :(得分:0)

您只需要对oldestDate对象数组进行排序,并获得第一个对象的value属性,这是最高的:

.rollup(function(oldestDate) {
    return oldestDate.sort(function(a, b) {
        return b.dateCode - a.dateCode
    })[0].value
});

以下是演示:

var csv = `breakfastItem,gluten,breakfastItemType,month,year,dateCode,value
Bagel,Yes,Cinnamon Raisin,May,2017,42856,300
Bagel,Yes,Cinnamon Raisin,March,2017,42795,100
Bagel,Yes,Cinnamon Raisin,November,2016,42675,20
Bagel,Yes,Blueberry,February,2017,42767,50
Bagel,Yes,Blueberry,November,2016,42675,30
Bagel,Yes,Blueberry,March,2016,42430,100
Bagel,Yes,Plain,February,2018,43132,200
Bagel,Yes,Plain,December,2017,43070,202
Bagel,Yes,Plain,February,2016,42401,201`;

var data = d3.csvParse(csv, function(d) {
  d.value = +d.value;
  d.year = +d.year;
  d.dateCode = +d.dateCode;
  return d;
});

var breakfastCombinations = d3.nest()
  .key(function(d) {
    return d.breakfastItem;
  })
  .key(function(d) {
    return d.breakfastItemType;
  })
  .rollup(function(oldestDate) {
    return oldestDate.sort(function(a, b) {
      return b.dateCode - a.dateCode
    })[0].value
  })
  .entries(data);

console.log(breakfastCombinations)
<script src="https://d3js.org/d3.v4.min.js"></script>