Rounded stack d3

by KgomDr

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.15.0/d3.min.js"></script>
<p>&nbsp;</p>
<div id="chart-box-2">
  <div id="chart1"></div>
</div>

CSS

.chart-box-2 {
  width: 1500px;
  height: 1500px;
  
}

.chart1{
  padding-top: 80px;
}

JavaScript

function bar(x, y, w, y1, r, f) {
    // Flag for sweep:
    if (f == undefined) f = 1;
    // x coordinates of top of arcs
    var x0 = x + r;
    var x1 = x + w - r;
    // y coordinates of bottom of arcs
    var y0 = y1 + r;
    // just for convenience (slightly different than above):
    var l = "L", a = "A";

    var parts = ["M", x, y, l, x, y0, a, r, r, 0, 0, f, x0, y1, l, x1, y1, a, r, r, 0, 0, f, x + w, y0, l, x + w, y, "Z"];
    return parts.join(" ");
}

var data = [
            {
                Category: "Q1",
                LKV: 400,
                NoRisk: 200,
                SROI: 100,
                LKV1: 230,
                NoRisk1: 100,
                SROI1: 130,
                LKV2: 280,
                NoRisk2: 280,
                SROI2: 180
            },
            {
                Category: "Q2",
                LKV: 200,
                NoRisk: 100,
                SROI: 200,
                LKV1: 300,
                NoRisk1: 450,
                SROI1: 120,
                LKV2: 300,
                NoRisk2: 450,
                SROI2: 120
            },
            {
                Category: "Q3",
                LKV: 100,
                NoRisk: 100,
                SROI: 200,
                LKV1: 110,
                NoRisk1: 450,
                SROI1: 120,
                LKV2: 300,
                NoRisk2: 450,
                SROI2: 120
            },
            {
                Category: "Q4",
                LKV: 10,
                NoRisk: 100,
                SROI: 200,
                LKV1: 300,
                NoRisk1: 450,
                SROI1: 120,
                LKV2: 380,
                NoRisk2: 450,
                SROI2: 120
            }
        ];
        var w = 400, h = 400, padding = 40;
        var svg = d3.select('#chart1').append('svg')
            .style('margin-top', '-20px')
            .attr('width', w)
            .attr('height', h);

        var datasets = [
           ...