javascript function that populates an svg element with aydede logo

aydede.js

WIDTH = 600
CX = WIDTH / 2
CY = WIDTH / 2

let svg = document.getElementById("aydede");
svg.setAttribute("width", WIDTH);
svg.setAttribute("height", WIDTH);

function drawCircularArc(cx, cy, r, startAngle, endAngle, color)
{
    let path = document.createElementNS("http://www.w3.org/2000/svg", "path");
    let d = "M " + (cx + r * Math.cos(startAngle)) + " " + (cy + r * Math.sin(startAngle)) +
            " A " + r + " " + r + " 0 0 1 " + (cx + r * Math.cos(endAngle)) + " " + (cy + r * Math.sin(endAngle));
    path.setAttribute("d", d);
    path.setAttribute("stroke", color);
    path.setAttribute("stroke-width", 2);
    path.setAttribute("fill", "none");
    svg.appendChild(path);
}

svg.innerHTML = ""
for(let i = 0; i < 9; i++)
{
    let delta = 10 * i;
    drawCircularArc(CX, CY, 10 * i, 0, (i * 0.1) * (Math.PI), "yellow");
    drawCircularArc(CX, CY, 10 * i, (-i * 0.1) * (Math.PI), 0, "yellow");
}