Javascript raphael.js-将饼图转换为圆环图

我尝试使用raphael.js示例，位于此处：

但是我想把饼图转换成一个甜甜圈图（在所有切片中间有一个孔）。目前，正在使用以下代码创建每个切片：

function sector(cx, cy, r, startAngle, endAngle, params) {
        //console.log(params.fill);
        var x1 = cx + r * Math.cos(-startAngle * rad),
            x2 = cx + r * Math.cos(-endAngle * rad),
            y1 = cy + r * Math.sin(-startAngle * rad),
            y2 = cy + r * Math.sin(-endAngle * rad);
        return paper.path(["M", cx, cy, "L", x1, y1, "A", r, r, 0, +(endAngle - startAngle > 180), 0, x2, y2, "z"]).attr(params);
    }

我如何修改它，以便从整个饼图中删除一个固定半径的孔？我在这里看到了这篇文章，这很有帮助，但我不太清楚如何或在何处将其应用于上面的代码：

---

饼图的一部分是如何创建的，如下所示：

移动到圆的中心（cx，cy）：“M”，cx，cy

画一条线直到弧开始的边缘（x1，y1）：“L”，x1，y1

在一些数学计算的基础上画一条弧：“A”，r，r，0，+（端角-startAngle>180），0，x2，y2

在圆圈中间画一条线：在这种情况下使用“z”；这意味着移动到原点（cx、cy）

切片（路径）已准备就绪

为了创建甜甜圈，您需要修改路径的组成方式。您需要有一个由2个圆弧（内部和外部）和2条线组成的路径来完成它

首先，你需要找到路径的起点，这是基于在甜甜圈中间的虚空圆的半径（半径<强> RIN < /强>）。让我们调用该点xx1和yy1的坐标：

xx1 = cx + rin * Math.cos(-startAngle * rad)
yy1 = cy + rin * Math.sin(-startAngle * rad)

从这一点开始构建路径（“M”，xx1，yy1）；

下一步是将线绘制到圆的边缘（“L”，x1，y1）。从那里你必须画出外弧（“A”，r，r，0，+（端角-startAngle>180），0，x2，y2），然后再画一条线到内弧的另一边（“L”，xx2，yy2）。要获取xx2和yy2的值：

xx2 = cx + rin * Math.cos(-endAngle * rad)
yy2 = cy + rin * Math.sin(-endAngle * rad)  

最后一步是通过绘制内弧来完成路径（“A”，rin，rin，0，+（endAngle-startAngle>180），1，xx1，yy1）。现在你有了一块油炸圈饼

---

**更新的小提琴链接

为什么不在饼图的中心画一个圆呢

paper.add([
    {
        type: "circle",
        cx: 250,
        cy: 250,
        r: 150,
        fill: "#ffffff"
    },
]);

---

这是非常令人印象深刻的，帮助alotanswer编辑。新的提琴链有效。幸亏