そこで、赤、緑、青のコンポーネントとそれらがどのように関連しているかを示す単純な色相ホイールを描画しようとしています。beginPath()
問題は、とを使用しているにもかかわらず、私の(単純な1度の)アークが後のアークのストロークを引き継いでいることですclosePath()
。
私の現在の進捗状況はhttp://meyerweb.com/eric/css/colors/hsl-from-rgb.htmlです。最も内側のリングは、そのリングを対象としたもので、青から黒にフェードします。次のリングアウトは緑のフェードから黒のみを表示し、3番目のリングアウトは赤のフェードから黒のみを表示する必要があります。最も外側の最も厚いリングは、色相ホイールの周りの全スペクトルを表示することを目的としています。これは、他のリングと同様に、細いスポークで見ることができます。
描画ブロックの順序を逆にすると、最も外側のリングが正常になり、すべての内側のリングが台無しになり、ストロークスタイルが前方に漏れていることは明らかです。どうやって、なぜ、どうやって問題を克服するのかわからない。4つの別々のオブジェクト(たとえば、ctx1
からctx4
)を定義し、それぞれに別々に描画する必要がありますか?
キャンバスの円弧のさまざまなfillStyleの色を調べましたが、そこでの推奨事項は役に立たなかったようです。他のグーグルは何の役にも立ちませんでした。