デジタル・デザイン・ラボラトリーな日々

アラフィフプログラマーが数学と物理と英語を基礎からやり直す。https://qiita.com/yaju

2012-01-01から1年間の記事一覧

座標の回転式における私の勘違い

座標を回転した位置を求める関数として以下を使用していた。 function rotate2d(x, y, rad) { var p = new Point; p.x = Math.cos(rad) * x - Math.sin(rad) * y; p.y = Math.sin(rad) * x + Math.cos(rad) * y; return p; } ある座標位置を30度回転した座標…

スプライン曲線

3次ベジェ曲線を使用して曲線にキャラクターを移動させた時、表示範囲の右側きりきりで半回転させようとして3次ベジェ曲線の制御点を右側最大値に設定しても曲線はそれより前に曲線が描かれてしまい、自分が想っている位置よりも間が空いてしまうわけです…

2次・3次ベジェ曲線

とある観賞用のプログラムを作成しているのですが、キャラクターの向きを反転させる必要がありまして、単純に向きを180度変更するなら簡単なんですが、車と同様に動いているものは急には向きを変更できないわけで、円弧を描いて反転させたいわけです。そ…

静岡Developers勉強会の「第3回HTML5読書会(主にCANVAS)」の資料公開

1月28日に行われた静岡Developers勉強会の第3回HTML5読書会では、課題図書として「HTML5&CSS3実践入門」を使用しております。静岡Developers勉強会には特別に外部から講師を招くようなことはせず、集まったメンバーで課題図書を章ごとに分担してセッション…

ハート型に広がる花火

これはバレンタインデーに向けて作成しました。 以前から花火を作ってみたいと思っていたんですが、どうせならとバレンタインデーも近かったため、花火が昇ったらハート型に広がるようにと作成しました。 実際作ってみると自分が思い描いていたようにはなら…

行列による2Dアフィン変換を理解してみる

前回、回転と拡大縮小と平行移動を3×3行列に合わせた式が以下になります。 回転行列 拡大縮小行列 平行移動行列 | cos -sin 0 | | sx 0 0 | | 1 0 t.x | | sin cos 0 | | 0 sy 0 | | 0 1 t.y | | 0 0 1 | | 0 0 1 | | 0 0 1 |そもそも、何故行列にしたのか?…

スポンサーリンク