How to fill an image inside my svg circles in d3.js
<p>This is my piece of code filling circles in my svg. </p>

<pre><code>   var svgContainer = d3.select("body").append("svg")
                                 .attr("width", 1000)
                             .attr("height", 1000);
    var circles = svgContainer.selectAll("circle")
                      .data(nodes)
                      .enter()
                      .append("circle");

     var circleAttributes = circles
                   .attr("cx", function (d) { return d.x_axis; })
                   .attr("cy", function (d) { return d.y_axis; })
                   .attr("r", function (d) { return d.radius; })
                   .attr('fill', 'green')
</code></pre>

<p>But instead of filling green color inside my circles, I want to fill different image inside each circles where the url is in my json data. I've been trying to use .attr('fill', url(function(d) {return d.url})) but it does not work. I am new to d3 and can anyone help me solving this task?</p>