【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

ラジアンとは
「角度の度数に円周率を掛けて 180 で割ったもの」
で、式にすると
ラジアン(radian) = 求めたい角度 * Math.PI /180
1ラジアンは 1* Math.PI/180。

10度・・・10*Math.PI/180
45度・・・45*Math.PI/ 180 (= Math.PI/4)でも可
90度・・・90*Math.PI/ 180( = Math.PI/2)でも可
180度・・・180*Math.PI/ 180 (= Math.PI)でも可
正円・・・360* Math.PI/180 (= Math.PI * 2)でも可

という式があるので
当てはめればいい。
例えば
下記図を描きたい場合

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度


こう。

これを時計回りにしたい場合、
上記コードの第6引数のBoolean値をfalseにする。もしくは書かない。

	ctx.arc(100, 100, 50, s, n*Math.PI/180, false)//ここだけ変えました


【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

0度から45度までを時計回りに描く

正円は

ctx.arc(100, 100, 50, s, 360*Math.PI/180, false);


【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

【canvas#arc()】ラジアンとは。開始位置角度と終了位置 角度

参照

様々な星の書き方
http://jsfiddle.net/m1erickson/8j6kdf4o/

キャンバスリファレンス
http://www.htmq.com/canvas/arc.shtml#001

http://www.pori2.net/html5/Canvas/040.html
http://honttoni.blog74.fc2.com/blog-entry-183.html
https://books.google.co.jp/books?id=Lt2sBwAAQBAJ&pg=PA66&lpg=PA66&dq=canvas+%E3%83%A9%E3%82%B8%E3%82%A2%E3%83%B3&source=bl&ots=M3Z8-LvVAG&sig=EbLeTxfy1jMRA5pZ_wAdVMWHtfM&hl=ja&sa=X&ved=0ahUKEwjrr9XJwOHSAhUCabwKHZkBBMs4ChDoAQg1MAU#v=onepage&q=canvas%20%E3%83%A9%E3%82%B8%E3%82%A2%E3%83%B3&f=false
http://jsfiddle.net/m1erickson/k5KsC/

(Visited 1 times, 1 visits today)