結果を表示する
元にもどす
◀︎
19
▶︎
<html lang="ja"> <meta charset="utf-8"> <canvas id="目印"width="300"height="300"></canvas> <script> let きゃんばす=document.getElementById("目印"); let こんてきすと=きゃんばす.getContext("2d"); let ぐらでーしょん=こんてきすと.createConicGradient(0, 150, 150); ぐらでーしょん.addColorStop(0,"red"); ぐらでーしょん.addColorStop(0.2,"yellow"); ぐらでーしょん.addColorStop(0.4,"silver"); ぐらでーしょん.addColorStop(0.6,"green"); ぐらでーしょん.addColorStop(0.8,"blue"); ぐらでーしょん.addColorStop(1,"red"); こんてきすと.fillStyle = ぐらでーしょん; こんてきすと.beginPath(); こんてきすと.arc(150,150,150,0,2 * Math.PI); こんてきすと.fill(); </script> <hr> <pre style="color:green;"> arc() 関数の引数 150, 150, 150, 0, 2 * Math.PI について arc(x, y, radius, startAngle, endAngle) arc() 関数はキャンバス上に円や円弧を描画するための関数. 説明 x → 円の中心の x座標（ここでは 150） y → 円の中心の y座標（ここでは 150） radius → 円の 半径（ここでは 150） startAngle → 円弧の開始角度（ラジアン単位 / ここでは 0）。 endAngle → 円弧の終了角度（ラジアン単位 / ここでは 2 * Math.PI で円を1周する角度を指定 </pre> </html>
◀︎ 19 ▶︎