score:1

Accepted answer

You could do this easily using d3.nest.

However, since you want those property names in your desired outcome, you can create your data array using a combination of forEach, filter and map.

Here is a demo. The outcome in the console.log corresponds to your data.data array:

var csv = d3.csvParse(d3.select("#csv").text());

var data = [];
[...new Set(csv.map(d => d.Category))].forEach(d => {
  data.push({
    Category: d,
    data: csv.filter(e => e.Category === d).map(f =>
      ({
        gene: f.Name,
        time: 1
      }))
  });
})

console.log(data)
pre {
  display: none;
}
<script src="https://d3js.org/d3.v4.min.js"></script>
<pre id="csv">Name,Category
CT396,"Adherence"
htpB,"Adherence"
msbA,"Adherence"
rfaE,"Adherence"
flgK,"Motility"
flhA,"Motility"
fliF,"Motility"</pre>

PS: I'm using a <pre> element to store your CSV.

score:0

try this one var data = [];

 d3.csv("VFs.csv", function(d) {
    data.push({
      Category: d.Category,
      data: [{
        gene: d.gen,
        time: 1
      }]
    })
 })

Related Query

More Query from same tag