d3js içinde kabarcıklar yerine dikdörtgen oluştur

Question

Çevreler oluşturmak için bu http://bl.ocks.org/mbostock/4063269 kullandım, ancak daire yerine dikdörtgen oluşturmalı ve tüm bu dikdörtgenlerin daha büyük bir dikdörtgenin içine sığması gerekiyor. lütfen yardım et.

Answer 1

Bu, daireler yerine dikdörtgenler nasıl yapabilirsiniz.

node.append("rect") 
     .attr("width", function(d) { return d.r*2; })//width is the diameter 
     .attr("x", function(d) { return d.r*-1; }) 
     .attr("y", function(d) { return d.r*-1; }) 
     .attr("height", function(d) { return d.r*2; })//height is the diameter 
     .style("fill", function(d) { return color(d.packageName); }); 

Şimdi onlara

//get all the data 
    var data = d3.selectAll("g")[0].map(function(d) { 
    return d3.select(d).data()[0] 
    }) 
    //get the min x max x min y max y 
    var xmin = d3.min(data, function(d){return d.x-d.r}) 
    var xmax = d3.max(data, function(d){return d.x+d.r}) 
    var ymin = d3.min(data, function(d){return d.y-d.r}) 
    var ymax = d3.max(data, function(d){return d.y+d.r}) 

    //make a rectangle to make it over other rectangles. 
    svg.insert("rect" ,":first-child") 
    .attr("x", xmin) 
    .attr("y", ymin) 
    .attr("height", ymax-ymin) 
    .attr("width", xmax-xmin) 
    .style("opacity", 0.3) 
    .style("fill","blue"); 

tüm teşekkürler