Различные символы узлов для диаграммы направленности, основанной на d3.js

Question

Как отображать узлы как разные символы в силовой директории d3.js? Я хотел бы реализовать что-то подобное тому, что я написал ниже:

var node = svg.selectAll(".node") 
     .data(graph.nodes) 
    .enter().append(function(d){return d.shape;}) 
     .attr("class", "node") 
     .attr("r", 5) 
     .style("fill", function(d) { return color(d.group); }) 
     .call(force.drag); 

Каждый узел будет иметь кодированную форму («прямоугольник», «круг», и т.д.). Тем не менее, я получаю ошибку:

Uncaught TypeError: Object function (d){return "circle";} has no method 'indexOf' 

Другой вопрос, который я относил к тому, что это: как бы я переключаться между применением различных атрибутов для каждой формы? Кругам нужен атрибут «r», но для прямоугольников требуются «высота» и «ширина». Благодаря!

Answer 1

Использовать d3.svg.symbol, как в примере force-directed symbols.