D3 CSS 强制布局中的自定义颜色

Question

我正在研究力导向布局。当我第一次开始这样做时，我在 CSS 中定义了颜色并且效果很好。在此过程中，我决定尝试内置的 D3 色标，但是当我尝试返回自定义 CSS 颜色时，代码不再 运行 没有色标线。不知何故，我 "stuck" 使用 d3 比例 - 此代码的第 4 行：https://jsfiddle.net/lilyelle/gwacm7z5/

var w = 600,
    h = 500,
    r = 30,
    fill = d3.scale.category10()
 ;

我知道我的 CSS 正在工作，因为我的指针事件命令正在工作 - 但不知何故 CSS 的其余部分不会将颜色应用到我的元素。任何人都可以帮助摆脱 d3 比例并恢复常规 CSS 样式吗？？？

谢谢！

Answer 1

你CSS应该是：

.node .type1 {
  fill:#690011;
}
.node .type2 {
  fill:#BF0426;
}

然后在创建您的圈子时：

node.append("circle")
  .attr("r", 35)
  .attr("class", function(d){
    return "node type" + d.type;
   })
  .on("mouseover", fade(.1))
  .on("mouseout", fade(1));

已更新 fiddle。