fill()メソッド

CanvasRenderingContext2D ＞ fill()メソッド

概要

　状態:- 　閲覧数:657 　投稿日:2016-01-24 　更新日:2016-08-24 　
現在の塗り潰しスタイルで、現在または指定されたパスを塗り潰す
void ctx.fill();
void ctx.fill(fillRule);
void ctx.fill(path, fillRule);

CanvasRenderingContext2D.fill()

デモコード

　閲覧数:372　投稿日:2016-01-29　更新日:2016-01-29　

1.パスに円弧を追加するarc()メソッドでの適用例


x座標値,Y座標値
・canvas中心

円弧の半径
・canvas÷2

コード
<canvas id="canv" width="500px" height="500px"></canvas>



<script>

  var ctx1 = document.getElementById("canv").getContext('2d');

  ctx1.fillStyle = "#0000CD";

  ctx1.beginPath();

  ctx1.arc(250, 250, 250, 15 * Math.PI / 180 , 270 * Math.PI / 180 , false);

  ctx1.fill();

</script>


コメント投稿(ログインが必要)



類似度ページランキング
順位 ページタイトル抜粋 ％
1 fill()メソッド 90
2 fillRect()メソッド 75
3 fillText()メソッド 75
4 lineTo()メソッド 73
5 clear()メソッド 67
6 scale()メソッド 67
7 now()メソッド 63
8 arc()メソッド 63
9 bindBuffer()メソッド 62
10 save()メソッド 60
11 rect()メソッド 60
12 clearRect()メソッド 56
13 transform()メソッド 56
14 beginPath()メソッド 56
15 compileShader()メソッド 55
16 moveTo()メソッド 55
17 translate() メソッド 54
18 clearColor()メソッド 54
19 clearDepth()メソッド 54
20 bufferData()メソッド 54
2024/4/26 22:50 更新
週間人気ページランキング ／ 4-19 → 4-25
順位 ページタイトル抜粋 アクセス数
1 シェーダー | compileShader()メソッド(WebGLRenderingContext) 4
1 HTML5用語 4
2 フォーム | その他 2
2 setTransform()メソッド | CanvasRenderingContext2D 2
3 WebGLProgram 1
3 W3C ／ World Wide Web Consortium | その他 1
3 save()メソッド(CanvasRenderingContext2D ) カテゴリー 1
3 save()メソッド | CanvasRenderingContext2D 1
3 lineTo()メソッド | CanvasRenderingContext2D 1
3 arc()メソッド | CanvasRenderingContext2D 1
3 new Image()オブジェクト生成(HTMLImageElementインターフェイス) カテゴリー 1
2024/4/26 1:02 更新