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

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

射影変換

射影変換(ホモグラフィ)について理解してみる 射影変換式について

昔、定期的に購読していた「C MAGAZINE」の大半は処分したんですが、処分する際に数冊程は内容を見て残しておいたのです。 C MAGAZINE 2005年1月号は、特集2が「物理運動をシュミレーションしよう」ってことでたぶん残したんですが、この本を何気に見ていた…

静岡Developers勉強会の「コンピュータビジョン 3章 画像間の写像」の資料公開

静岡Developers勉強会では、オライリーの「実践コンピュータビジョン」の本を読書会形式で勉強会をしています。2014/04/12(土)に担当した「実践コンピュータビジョン 3章 画像間の写像」の資料を公開します。内容としては、アフィン変換、射影変換、平均顔、…

【コンピュータビジョン】3章「画像間の写像」 ホモグラフィ(点の調整)

前記事で、「homography.pyでは、更に点群を平均値が0、標準偏差が1になるように正規化していますが、今回はそこまで説明はしません。」と逃げたのだが、アフィン変換でも同様のことをしていたので、頑張って調べてみます。参考:標準化した値は、平均値がゼ…

【コンピュータビジョン】3章「画像間の写像」 ホモグラフィ(特異値分解)

DLTアルゴリズムでは、点数の2倍の行を持つ下記の行列式に展開します。 これを特異値分解(Singular Value Decomposition:SVD)を用いて最小二乗法によりを求めます。下記ソースリストは、コンピュータビジョンの本に記載されているhomography.pyの一部です…

【コンピュータビジョン】3章「画像間の写像」 ホモグラフィ

今年の静岡Developes勉強会は「O'Reilly Japan - 実践 コンピュータビジョン」を課題図書として学んでいる。4/12に行われる「静岡Developers勉強会 コンピュータビジョン vol.3」では3章「画像間の写像」について勉強する。 3章ではホモグラフィーやアフィン…

射影変換(ホモグラフィ)について理解してみる その13

前回、猫画像1枚を3D回転させてみたが、CSSの3D回転ジェネレータの「3D CSS Tester(github)」を見つけたので、これをCSSでなく敢えてCanvasで動きを真似てみます。3D回転する際には、一般的には三角形に分割して表現します。 参照:テクスチャマッピングを理…

射影変換(ホモグラフィ)について理解してみる その12

パネルを3D回転させるようなことをやってみたいなと思っていたので作成してみました。 jsdo.itで見かけるものはパネルを三角形で分割して処理しているので、これを三角形で分割しないで射影変換で処理して表示してみます。 Image 3D rotation - jsdo.it Imag…

射影変換(ホモグラフィ)について理解してみる その11

射影変換についてツールも作成して、まーそれなりに理解は出来てきたわけですが、初回の記事で取り上げたHomography HIDIHO!サイトの射影変換の下記ソースリスト(actionscript)の疑問が残っていたわけです。(cv.jsのgetPerspectiveTransformも同様) static p…

射影変換(ホモグラフィ)について理解してみる その10

今回は、透明画像の対応について説明します。今回、使用する透明画像はこのボール(png形式)になります。 背景画像には、このかわいい猫ちゃんを使います。 前回のプログラムのままでは透明画像に対応していないため、ボールの周りが黒色になってしまいます。…

射影変換(ホモグラフィ)について理解してみる その9

射影変換(ホモグラフィ)について理解してみる その8

今まで射影変換するにしても、入力画像より小さくする方向しかパラメータを変更してませんでしたが、いざ、大きくしようとすると画像の位置が取れないために例外エラーになってしまいましたので、これを修正していきます。 また、入力画像の表示位置を原点(0…

射影変換(ホモグラフィ)について理解してみる その7

画像補完の予定でしたが、その前段階でおかしな現象を見つけてしまいました。 「射影変換(ホモグラフィ)について理解してみる その4」から射影変換のパラメータを逆行列変換して描画処理に渡していました。ところが今頃気が付いたのですが、その方法では実…

射影変換(ホモグラフィ)について理解してみる その6

前回は、自前の行列クラスを使用して射影変換を行いましたが、Javascriptの行列演算用のライブラリが有志によって公開されています。 glMatrix.js mjs.js minMatrix.js tmlib.js Sylvester.js closure TDL J3DIMath.js(以前はCanvasMatrix.jsという名前だっ…

射影変換(ホモグラフィ)について理解してみる その5

前回までは、代数ライブラリsylvesterを使用して行列計算を求めてきましたが、今回は代数ライブラリを使わずに8次元連立方程式を4x4行列で求める方法を説明します。ARToolKitを参考に様々な言語に実装し直したARToolKit互換のクラスライブラリNyARToolKitの…

射影変換(ホモグラフィ)について理解してみる その4

前回は、転送元座標と転送先座標を内部的に入れ替えて射影変換パラメータを求めて画像に穴が空かないように表示していました。 しかし、下記サイトのCSSのtransformで渡している8個のパラメータを求める際には、特に転送元座標と転送先座標を入れ替えたりし…

射影変換(ホモグラフィ)について理解してみる その3

前回は、代数ライブラリを使って8個のパラメータを取得しました。今回は、8個のパラメータを使って画像を変形して表示させます。 CSSでは、matrix3dに3x3の正方行列として9(8+1)個のパラメータをセットして画像を変形して表示していましたが、これをmatrix3d…

射影変換(ホモグラフィ)について理解してみる その2

前回の続きです。 ただ、私としては台形に変形させたいので、8次元連立一次方程式を解いた方式をさらに模索していた中で、下記サイトを見つけました。 ホモグラフィ- Shogo Computing Laboratory 内容的には私が目指していたものですが、残念なのは中身はCSS…

射影変換(ホモグラフィ)について理解してみる

「3Dを基礎から勉強する フラットシェーディング」の記事を書いて、次は立方体のテクスチャマッピングに取り掛かろうと思ったんですが、ふとアフィン変換で台形は出来ないってことを書いたことを思い出したんです。テクスチャマッピングについては、「テクス…