d3.js选择节点并改变它们的风格

时间:2015-03-11 09:32:39

标签: d3.js

我的代码包含显示节点链接映射的节点和链接。

d3sparql.graph = function(json, config) {
  var head = json.head.vars
  var data = json.results.bindings

  var opts = {
    "key1":   config.key1   || head[0] || "key1",
    "key2":   config.key2   || head[1] || "key2",
    "label1": config.label1 || head[2] || false,  // optional
    "label2": config.label2 || head[3] || false,  // optional
  }
  var graph = {
    "nodes": [],
    "links": []
  }
  var check = d3.map()
  var index = 0
  for (var i = 0; i < data.length; i++) {
    var key1 = data[i][opts.key1].value
    var key2 = data[i][opts.key2].value
    var label1 = opts.label1 ? data[i][opts.label1].value : key1
    var label2 = opts.label2 ? data[i][opts.label2].value : key2
    if (!check.has(key1)) {
      graph.nodes.push({"key": key1, "label": label1})
      check.set(key1, index)
      index++
    }
    if (!check.has(key2)) {
      graph.nodes.push({"key": key2, "label": label2})
      check.set(key2, index)
      index++
    }
    graph.links.push({"source": check.get(key1), "target": check.get(key2)})
  }
  return graph
}

我想要实现的是修改节点的样式(颜色和大小......)

我尝试在return graph

之前插入此内容
d3.selectAll(graph.nodes).style("fill", "black");
d3.selectAll(graph.nodes).attr("r", 30);

哪个不起作用..我做错了什么?

1 个答案:

答案 0 :(得分:1)

您无法按D3中的数据选择元素。 .selectAll()需要CSS selector来选择DOM元素。因此,您必须按照之前添加的名称/类来选择表示该数据的元素。