@woosh/meep-engine/src/view/elements/radial/makeDonut.js

Pure JavaScript game engine. Fully featured and production ready.

import SVG from "../../SVG.js";

/**
 *
 * @param {number} outerRadius
 * @param {number} innerRadius
 * @param {number} centerX
 * @param {number} centerY
 * @returns {Element} SVG path element
 */
export function makeDonut(outerRadius, innerRadius, centerX, centerY) {
    const el = SVG.createElement("path");
    const dValue = [
        `M ${centerX} ${centerY - outerRadius}`,
        `A ${outerRadius} ${outerRadius} 0 1 0 ${centerX} ${centerY + outerRadius}`,
        `A ${outerRadius} ${outerRadius} 0 1 0 ${centerX} ${centerY - outerRadius}`,
        "Z",
        `M ${centerX} ${centerY - innerRadius}`,
        `A ${innerRadius} ${innerRadius} 0 1 1 ${centerX} ${centerY + innerRadius}`,
        `A ${innerRadius} ${innerRadius} 0 1 1 ${centerX} ${centerY - innerRadius}`,
        "Z",
    ].join(" ");

    el.setAttribute("d", dValue);
    return el;
}