svg - d3.svg.arc() でラージ アークまたはスイープ フラグを設定するにはどうすればよいですか

Question

d3を使用して円弧で円を描いています。ただし、これは 10 度から 20 度、さらには 300 度から 350 度で始まるパーツの描画には問題なく機能します。

時々、350 度から 5 度までの円弧を描く必要があるので、5 度から 350 度までずっと続く円弧ではなく、15 度の円弧を描きます。 d3.svg.arc() を使用していますか? (開始と終了を入れ替えても、d3.svg.arc() では違いがないことに注意してください)

Answer 1

私はd3が初めてなので、もっと簡単なものがあるかもしれません。

角度を 0 -> スイープとして定義し、反時計回りに回転させることができます。したがって、350 から 5 の場合:

var arc = d3.svg.arc()
    .innerRadius(50)
    .outerRadius(70)
    .startAngle(0)
    .endAngle(15 * (Math.PI/180));

svg.append("path")
    .attr("d", arc)
    .attr("transform", "rotate(-10)");

これはjsFiddleです。