javascript - 使用 d3 根据其他行向 csv 添加一列

Question

我正在使用 D3 和 JavaScript 来操作一些 csv 数据。这个想法是，它记录人们全天去了哪里:他们可能从家里开始，去杂货店、学校、工作等。每次有人离开他们所在的位置时，都会在 csv 文件中记录一个新行。所以，当 Sally 醒来时，它会记录 Sally,home，当她去学校时，它会记录 Sally,school，等等。这些地方是任意的，可以进去任意顺序，并且可能还有更多位置。

我的 csv 文件如下所示:

name,place
Sally,home
Joe,home
Bill,work
Joe,work
Sally,school
Sally,grocery
Bill,salon
Joe,grocery

我想在每一行中添加一列，其中包含同一个人的下一步。本质上，我希望数据能够反射(reflect) home 和 school 之间、school 和 grocery 之间的转换，或者其他什么相邻的步骤是。在第一个数据点中，Sally 在家，下次提到她时，她在学校。因此，我希望第一个数据点不是简单的 Sally，home，而是更改为 Sally，home，school 以反射(reflect)转变。因此，上面的内容经过处理后应该如下所示:

name,place,next
Sally,home,school
Joe,home,work
Bill,work,salon
Joe,work,grocery
Sally,school,grocery
Sally,grocery
Bill,salon
Joe,grocery

然后，我想删除每个人的最后一步:基本上，任何没有“下一个”列的内容(这些可能并不总是最后三行)。最终结果如下所示:

name,place,next
Sally,home,school
Joe,home,work
Bill,work,salon
Joe,work,grocery
Sally,school,grocery

我对此的唯一想法是使用嵌套的 for 循环来查找下一个匹配的名称，然后以某种方式添加新列...这是我的尝试，但你不能像这样声明一个新列。

d3.csv("data.csv", function(error, data) {
for(i=0; i<data.length; i++){
    for(j=0; j<data.length; j++){
        if (data[i].name === data[j].name){
            data[i].next = data[j].place;
            break;
        }
    }
}
});

任何正确方向的指示都将不胜感激(最终目标是能够将此流程放入 D3 的桑基图中，如果有帮助的话)。

Answer 1

“但是你不能像这样声明一个新列”是什么意思？？是的，您可以(当然，我正在考虑您将要使用的数据数组，而不是实际的 CSV。但是，如果您确实想要保存一个新的 CSV文件，请相应地编辑您的问题并删除 D3 标签，因为 D3 没有方法实现此目的)。

我要在代码中做的唯一更改是在外部 (i) 循环之后的一个位置启动内部 (j) 循环:

for (i = 0; i < data.length; i++) {
  for (j = i + 1; j < data.length; j++) {
    if (data[i].name === data[j].name) {
      data[i].next = data[j].place;
      break;
    }
  }
}

然后，我们删除没有 next 属性的对象:

var finalData = data.filter(function(d) {
  return d.next
});

这是包含您的数据的演示:

var data = d3.csvParse(d3.select("#csv").text());
for (i = 0; i < data.length; i++) {
  for (j = i + 1; j < data.length; j++) {
    if (data[i].name === data[j].name) {
      data[i].next = data[j].place;
      break;
    }
  }
}
var finalData = data.filter(function(d) {
  return d.next
});

console.log(finalData)

pre {
  display: none;
}

<script src="https://d3js.org/d3.v4.min.js"></script>
<pre id="csv">name,place
Sally,home
Joe,home
Bill,work
Joe,work
Sally,school
Sally,grocery
Bill,salon
Joe,grocery</pre>