javascript - 有向图-节点级CSS样式

我发现了这个出色的示例和用于绘制有向图的示例代码-http://bl.ocks.org/cjrd/6863459
但是，graph-creator.css文件为所有节点定义了全局样式。如果我想为所有其他节点的某些“特殊”节点分配不同的样式（我希望它们具有不同的形状，并且颜色也不同，并且如果可能的话，还需要不同的透明度），该怎么办？我将如何修改此代码以添加这些特定于节点的效果？

最佳答案

您可以根据不同的情况在这里选择append不同的形状：

// append new elements in <g> element in scenario X
// you can pass different parameters for specific styling here
// for example, user select "red" color rect in setting filters

newGs.append("circle")
  .attr("r", String(consts.nodeRadius));

// alternatively append rect
newGs.append("rect")
  .attr({
    "x": // mouse event info as circles in the demo
    "y": // mouse event info as circles in the demo
    "width": String(consts.rectWidth),
    "height": String(consts.rectHeight)
  })
  .attr("class", "myRectStyle") // set styles in css
  .attr("fill", "red")
  .attr("rx",5)
  .attr("ry",5)