未分類 スマートフォンでのタッチイベント
スマートフォンでのタッチイベントPCのマウス操作も、画面タッチ対応になっているonmousedownマウスボタンを押したときのイベントこれは、画面タッチしたときのイベントになるonmouseupマウスボタンを離したときのイベントこれは、画面...
2013-03
未分類 未分類 画像を一部分だけ切り取って描画
画像を一部分だけ取り出して描画 画像を一部分だけ取り出してcanvasへ描画するにはdrawImage()を使う書式はcontext.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)以下は引数...
未分類 Canvasでベジエ曲線を使う
ベジエ曲線を使う二次ベジエ曲線の書式はcontext.quadraticCurveTo(cpx, cpy, x, y)三次ベジエ曲線の書式はcontext.bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x , ...
未分類 arcTo()について
arcTo()についてarcTo()も円弧を描くこちらは、パスの最終地点から座標(x1,y1)と座標(x2,y2)を通る曲線をパスに追加するarcTo()の書式はcontext.arcTo(x1,y1, x2,y2, 半径)
未分類 円弧ベジエ曲線
円弧ベジエ曲線図形を描くとき、円弧を描くarc()arcTo()ベジエ曲線を描くbezierCurveTo()が使えるまずは、arc()についてarc()は、パスに基点を追加し円弧を描くarc()の書式は、context.arc(x, y,...
未分類 パスと塗りについて
パスと塗りコンピューターの世界でパスは、ファイルやフォルダーの場所を示すがグラフィックの世界だと図形の外郭、輪郭になる以下は、パスを操作するメソッドbeginPath()パスの指定をリセットclosePath()現在まで指定されたパスを閉じ...
未分類 canvasへ多角形の描画
canvasで多角形の描画多角形を描画するにははじめに多角形の頂点を結んだパスを描画つまり、点を作るこれは、moveTo()で作成する次に、線を引くこれは、lineTo()これで、多角形の頂点の座標をつなげていくその後、fill()で、多角...
未分類 Canvasで多角形の描画
canvasで多角形の描画多角形を描画するにははじめに多角形の頂点を結んだパスを描画つまり、点を作るこれは、moveTo()で作成する次に、線を引くこれは、lineTo()これで、多角形の頂点の座標をつなげていくその後、fill()で、多角...
未分類 Javascriptで定期的に処理を実行
Javascriptで定期的に処理を実行Javascriptで定期的に処理を実行するならsetInterval()を使う書式は、setInterval(func, msec)引数の意味はfunc定期的に繰り返す関数のオブジェクトmsecミリ...
未分類 canvasの基本的な使い方
canvasの基本的な使い方canvasタグを記述しcanvasオブジェクト取得canvasオブジェクトからコンテキスト取得コンテキストのメソッドやプロパティを使い描画するcanvasオブジェクト取得しただけだと描画まではできないこれは、c...