web

ベジエ曲線

曲線を描画するためのメソッド 最初の場所はmoveToで指定する。 円弧を描画。 context.arc( 横位置1, 縦位置1, 横位置2, 縦位置2, 半径 ); まず、2つの位置と半径を指定。 この2点を通過する半径の円弧を作成。...
web

直線と多角形

See the Pen GEKBpB by nuto (@exarow) on CodePen. パスに指定の地点を追加。 context.move( 横位置 , 縦位置 ); パスに指定の地点を追加し、最後に追加された地点...
web

円・円弧を描画

See the Pen RVXmLj by nuto (@exarow) on CodePen. Canvasには、円を描くメソッドが無い。 あるのは、円弧を描くメソッドだけ。 円弧を一周分描けば、円になるので、問題はないの...
web

context.beginPath(); の考え方

See the Pen bWXzJJ by nuto (@exarow) on CodePen. パスの考え方 Canvasには四角形を描くメソッドしかない。 それ以外の図形を描くためには、『パス』を使う。 パスは、図形の形だ...
web

ドラッグで動かす

onmouseでスクリプトを書いたら、当然タッチパネルには対応しなかった。 しかし、調べたらなんかすぐにサンプルが出てきたので、実装してみた。 書き方間違っているかもしれないが、とりあえず動いたので載せてみた。 See the...
web

成功する人間のたった一つの”Mental Attitude”(精神的姿勢)

問題点の再認識 現代社会においての一つの成功として、最も一般的に認識されることは経済的充足が挙げられるだろう。 もちろん、それ以外のものとして家族関係や人間関係が良好であるとか、知識的探究心の充足、身体的、精神的な健康、承認欲求の充足な...
web

Position Move

今回はスライダーで変更できるポジションプロパティをいじってみた。 (日本語変だ・・・) 要するに、前にサイズをいじったので、位置もいじってみようというわけだ。   See the Pen MmdEEj by nuto (@ex...
web

Size Change

See the Pen eWaYYV by nuto (@exarow) on CodePen. 上記のように、 <input type="range" id="w" min="50" max="500" onchan...
web

RGB Slider

msg.style.backgroundColor = 'rgb(' + r +',' + g + ',' + b + ')'; の意味が分からないが、とりあえず書いてみた。 まずは、それぞれのスライダーから値を取り出す。 var r...
web

割り勘電卓

*この記事は、ドットインストール様の無料レッスンを勉強させて頂いたときに、分かり難かった個所を自分なりに備忘録として解説とともに書き綴ったものです。   <!DOCTYPE html><html lang=...
タイトルとURLをコピーしました