svg / d3.js rounded corner on one corner of a rectangle

Question

I know svg has an in built function to do rounded corners, but I need to do rounded corners on only 2 of the four corners.

I know I can draw multiple rectangles on t

Answer 1

In case others end up here wanting to round all corners of a rect element, you can add an rx attribute to the rect element (as @mbostock mentions in his fiddle above):

var rectangle = group.append("rect")
    .attr("width", 60)
    .attr("height", 75)
    .attr("rx", 4)
    .style("fill", function(d) { return "#e6653e"; })
    .style("stroke", function(d) { return d3.rgb("#e6653e").darker(); })