如何用D3制作圆形svg图像

时间:2015-11-19 14:34:13

标签: javascript d3.js svg

我正在使用D3创建一个力导向可视化,并希望我的节点是圆形图像。我已经使用下面的代码为每个节点成功创建了一个图像,但是我很难知道如何使这些图像成为圆形而不是矩形。

var nodeEnter = node.enter().append('g')
  .attr('class', 'node')
  .on('click', click)
  .call(force.drag);

nodeEnter.append('image')
  .attr('xlink:href',  function(d) {return d.avatarUrl;})
  .attr('height', 50)
  .attr('width', 50);

nodeEnter.append('a').attr('xlink:href', function(d) {return '/customer/' + d.id;})
  .append('text')
  .text(function(d) {return d.email;})
  .attr('dx', 25)
  .attr('dy', '4.5em')
  .style('font-size', '14px')
  .attr('text-anchor', 'middle');

这是当前的50 x 50图像。我的目标是半径为25px的圆圈。 enter image description here

0 个答案:

没有答案