Question

我希望从dropdown/select list文件中创建.csv。是否可以从dropdown/select创建d3 nest列表？我正在处理从.csv文件填充的强制定向图。我希望用户能够从下拉列表中选择要突出显示的节点。以前我使用基于文本搜索并且它有效，但实际上我正在寻找dropdown list而不是基于文本的搜索。提前谢谢！

您可以参考this link

var nodesmap = d3.nest()
    .key(function (d) { return d.name; })
    .rollup(function (d) { return { "name": d[0].name, "group": d[0].group, "size": d[0].size  }; })
    .map(graph.nodes);    

var output = document.createElement('block_container');
var select = d3.select("#searchName").append("select");

list.selectAll("option")
            .data(nodesmap)
            .enter()
            .append("option")
            .attr("value", function(d) {return d.key;})
            .text(function(d) {
                return d.key; });

return output;

我使用了les_mis.csv

P.s：我甚至不确定我是否正确设置了jsfiddle。请原谅我的noobness。

Answer 1

首先，我认为您在变量名称为list时键入select。其次，您的nodesmap对象没有.key的属性。

这会有效：

  var select = d3.select("#searchName")
    .append("select")
    .on('change', searchNode); //<-- fire your search function on change

  select.selectAll("option")
    .data(graph.nodes) //<-- use graph.nodes
    .enter()
    .append("option")
    .attr("value", function(d) {return d.name;}) //<-- it has a name property
    .text(function(d) {
        return d.name; 
    });

 function searchNode() {

  //find the node
  var selectedVal = this.options[this.selectedIndex].value; //<-- get value from dropdown

  ...

完整的工作代码here。

使用d3嵌套从csv创建下拉列表/选择列表

1 个答案: