如何在d3js中将背景色设置为图像图案？

Question

这是我制作svg的方法：

  var mainSVG = d3
    .select('body')
    .append('svg:svg')
    .attr('width', '100%')
    .attr('height', '100%')
    .attr('id', 'svg')
    .attr('pointer-events', 'all')
    .attr('perserveAspectRatio', 'xMinYMid')

这是我创建圆圈图像的方式：

    mainSVG
      .append('defs')
      .append('pattern')
      .attr('id', vertex.id)
      .attr('patternUnits', 'userSpaceOnUse')
      .attr('x', -vertex.radius)
      .attr('y', -vertex.radius)
      .attr('width', vertex.radius * 2)
      .attr('height', vertex.radius * 2)
      .append('image')
      .attr('xlink:href', vertex.picture)
      .attr('width', vertex.radius * 2)
      .attr('height', vertex.radius * 2);

有时图片太宽或太窄，因此它们周围带有白色背景，但是由于图像的背景是黑色，因此看起来很糟糕。如何为圆形设置背景颜色？