Canvasで超簡単に点線・破線を引く方法!JavaScript

jsファイルかvue呼び出す HTML5
こんにちは、
今回はCanvasで点線、破線を簡単に引く方法を
ご紹介致します。

なんとリファレンスをみる限り
Canvasは点線や破線は引けないみたいですね。

Canvasの点線や破線を引こうと検索しましたが、
ライブラリや長々とコードを書かなくてはならない方法が多かったので
シンプルに点線・破線を引きました。

Canvasで点線・破線を引く方法!

 
canvasで点線を引く  
完成は上の画像です。
スポンサーリンク


方法だけ書きますと、

Canvasに線を引くlineToは使用せず、
stokeStyleもしくはarcを使用。
そして引きたい座標に
反復して描画します。

サンプルコード

 

 
参考:Canvasで色々な直線を引いてみよう!【おまけつきだ・・・っ!】

 

コメント

タイトルとURLをコピーしました