この記事では、主にHTML5キャンバスを紹介して、点線を描画します。 HTML5は、点線を描画する方法を提供しません。この記事は、スタックオーバーフロー法に基づいて変更されます。それを必要とする友達はそれを参照できます。
HTML5 Canvasはグラフィックを描画するための多くの機能を提供しますが、残念ながらCanvas APIは、固体ライン(Lineto)を描画する機能のみを提供しますが、点線を描画する方法は提供しません。このようなデザインは、時々大きな不便を引き起こす可能性があります。 JavaScriptの権威あるガイドの著者であるDavid Flanaganは、特に標準の変更と実装が比較的単純である場合、そのような決定は問題があると考えています(…仕様に追加するのはとても些細なことであり、実装するのは些細なことです...私はあなたが本当に間違いを犯していると思います。 —http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2007-may/011224.html)。
Stack Overflowでは、Phrogzは点線(http://stackoverflow.com/questions/4576724/dotted-stroke-in-canvas)の独自の実装を提供します。それで、点線を描く必要がある場合(下の図に示すように)、どうすればよいですか?
以下は私自身の実装であり、水平および垂直のドット線の描画ラインのみをサポートするだけです。 Slash Drawingの機能を追加するには、PhorogzとRod MacDougallの方法を参照できます。
コードをコピーします