Javascript 如何告诉d3js这个半圆环图应该从左到右填充值

我有一个半甜甜圈，我已经有了一个完整的甜甜圈图表的代码，现在看起来是这样的：

如图所示，该值为零，但零不应占据图表的一半。如何将零设置为从最左角开始？或者换句话说，我如何告诉d3js图表应该从左到右填充值。这是我的代码：

let initChart = function() {
                let width = 148;
                let height = 148;
                let radius = Math.min(width, height) / 2;
                let color = d3.scale.ordinal().range(scope.colors);
                let selector = '#half-donut-' + scope.section;
                let angle = 0.5 * Math.PI;
                let data = [
                    {
                        label: 'Data',
                        value: _data
                    }
                ];

                let backgroundArc = d3.svg
                    .arc()
                    .innerRadius(58)
                    .outerRadius(radius)
                    .cornerRadius(20)
                    .startAngle(angle * -1)
                    .endAngle(angle);

                let mainArc = d3.svg
                    .arc()
                    .innerRadius(58)
                    .outerRadius(radius)
                    .cornerRadius(20)
                    .startAngle(angle * -1)
                    .endAngle(function(d) {
                        return (d.value / 100) * angle;
                    });

                let svg = d3
                    .select(selector)
                    .append('svg')
                    .attr('width', width)
                    .attr('height', height);

                let charts = svg
                    .selectAll('g')
                    .data(data)
                    .enter()
                    .append('g')
                    .attr('transform', function() {
                        return (
                            'translate(' + width / 2 + ',' + height / 2 + ')'
                        );
                    });

                let legend = svg
                    .selectAll('.legend')
                    .data(data)
                    .enter()
                    .append('g')
                    .attr('class', 'legend')
                    .attr('transform', function() {
                        return 'translate(' + -21 + ',' + -21 + ')';
                    });
                legend
                    .append('text')
                    .attr('x', 22)
                    .attr('y', 12)
                    .attr('text-anchor', 'middle')
                    .attr(
                        'transform',
                        'translate(' + width / 2 + ',' + height / 2 + ')'
                    )
                    .text(function(d) {
                        return d.value + '%';
                    });
                charts
                    .append('path')
                    .attr('d', backgroundArc)
                    .attr('fill', '#F3F3F4');

                charts
                    .append('path')
                    .attr('d', mainArc)
                    .attr('fill', color);
            };

---

提前感谢。

计算相对于startAngle的端角

.endAngle(function(d) { return -angle + (d.value / 100) * 2 * angle; });

---

或者使用示例中使用的

pie

方法

Awesome，将其应用于mainArc（绿色的），看起来非常完美，谢谢大家。我会记下你的答案。