画像処理ソリューション
これを見れば画像処理の入門から基礎~応用まで全てがわかるのを目指して!
   
翻訳(Translate)

プロフィール

Akira

ニックネーム:Akira
東京都の町田事業所に勤務
画像処理ソフトの開発を行っています。リンクフリーです!
詳細プロフィールは こちら
お問い合わせは、こちら↓

【補助HP】
画像処理ソリューションWeb版 【Newブログ】
イメージングソリューション

スポンサーリンク


カテゴリ

最近のコメント

カレンダー

01 | 2011/02 | 03
S M T W T F S
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 - - - - -

趣味のブログ

iPhone萬歳!
iPhoneの情報いろいろ。
ブログ学習帳
ブログ、SEO、アフィリエイト情報など(まだまだこれから)
俺流クラフト日記
ハンドメイド作品の記録(現在、放置中)

スポンサーリンク 最近の記事
(09/18)  計測測定展に光切断のデモを出展しました
(08/17)  ディジタル画像技術事典200に記事が載りました
(06/09)  光切断を画像センシング展で公開
(05/14)  中国(上海)へ行って来ました
(04/12)  韓国へ行って来ました
(03/10)  私の求める新人像
(01/18)  エレクトロテストジャパンにカラー光切断法のデモを出展しました。
(12/23)  ユニークアクセス200万達成!
(12/10)  【カラー光切断法】YouTube動画まとめ
(11/04)  国際画像機器展2014にカラー光切断法を出展します。
(10/05)  第25回コンピュータビジョン勉強会@関東に参加してきました。
(09/08)  フーリエ変換の記事を追加しました。
(08/09)  【画像処理】ランキング低下中
(07/06)  記事の更新が停滞中...
(06/08)  画像センシング展2014でカラー光切断法のデモを行います。
(05/17)  カラー光切断法の動画を公開しました。
(04/30)  ソニーα NEX-5Rで星空撮影
(04/10)  カラー光切断法の取込結果を追加しました
(03/08)  Korea Vision Show 2014へ行ってきました
(02/05)  フーリエ変換シリーズを始めます。
(01/06)  2014年、あけましておめでとうございます。
(12/04)  カラー光切断法を公開(国際画像機器展2013にて)
(11/13)  国際画像機器展2013に出展します
(10/14)  「画像処理のためのC#」はじめます。
(09/16)  【C#,VB.NET】高速描画コントロールをバージョンアップしました。
(09/04)  拡大鏡に輝度値表示、ルーラー機能を追加した個人ツールを公開
(08/05)  7月の拍手Top5
(07/06)  2013年6月人気記事Top5
(05/12)  SONY α NEX-5Rレビュー
(04/24)  SONY α NEX-5RY購入

【C#】マウスホイールで画像の拡大縮小

これまで紹介してきた記事の内容を使って、マウスホイールで画像を拡大縮小する方法を紹介します。
(必要な知識) これらを使って、下図のようにマウスポインタを中心として、画像の拡大縮小するプログラムを作成しました。
サンプルプログラムのダウンロードはこちらより

サンプルプログラム実行例


画像の拡大縮小表示のポイントは、任意点周りの回転移動でも紹介しているように、画像の拡大縮小では原点を中心として画像を拡大縮小するので、任意の点を中心として拡大縮小する場合は中心の点を原点へ移動し、拡大縮小後、元の位置へ移動する処理を行います。 点(X、Y)を中心に画像を拡大表示する場合
マウスホイールで画像の拡大縮小
点(X、Y)を原点へ移動します。
   マウスホイールで画像の拡大縮小
原点へ移動後、画像の拡大縮小処理を行います。
   マウスホイールで画像の拡大縮小
点を元の位置へ戻します。
   マウスホイールで画像の拡大縮小
サンプルプログラムは以下の通り
サンプルプログラムのダウンロードはこちらより

やっている事の割には、意外と簡単。
昔は大変だった...
Loading...
スポンサーリンク

スポンサーリンク 最近の記事
(09/18)  計測測定展に光切断のデモを出展しました
(08/17)  ディジタル画像技術事典200に記事が載りました
(06/09)  光切断を画像センシング展で公開
(05/14)  中国(上海)へ行って来ました
(04/12)  韓国へ行って来ました
(03/10)  私の求める新人像
(01/18)  エレクトロテストジャパンにカラー光切断法のデモを出展しました。
(12/23)  ユニークアクセス200万達成!
(12/10)  【カラー光切断法】YouTube動画まとめ
(11/04)  国際画像機器展2014にカラー光切断法を出展します。
(10/05)  第25回コンピュータビジョン勉強会@関東に参加してきました。
(09/08)  フーリエ変換の記事を追加しました。
(08/09)  【画像処理】ランキング低下中
(07/06)  記事の更新が停滞中...
(06/08)  画像センシング展2014でカラー光切断法のデモを行います。
(05/17)  カラー光切断法の動画を公開しました。
(04/30)  ソニーα NEX-5Rで星空撮影
(04/10)  カラー光切断法の取込結果を追加しました
(03/08)  Korea Vision Show 2014へ行ってきました
(02/05)  フーリエ変換シリーズを始めます。
(01/06)  2014年、あけましておめでとうございます。
(12/04)  カラー光切断法を公開(国際画像機器展2013にて)
(11/13)  国際画像機器展2013に出展します
(10/14)  「画像処理のためのC#」はじめます。
(09/16)  【C#,VB.NET】高速描画コントロールをバージョンアップしました。
(09/04)  拡大鏡に輝度値表示、ルーラー機能を追加した個人ツールを公開
(08/05)  7月の拍手Top5
(07/06)  2013年6月人気記事Top5
(05/12)  SONY α NEX-5Rレビュー
(04/24)  SONY α NEX-5RY購入

【C#】マウスホイールイベントの追加方法

C#のマウスホイールイベントは、Visual Studioのプロパティウィンドウのイベントでは表示されていないため、自分でイベントを登録する必要があります。

まずはサンプルプログラムを参照下さい。
サンプルプログラムのダウンロードはこちらより

Formのコンストラクタ部分でマウスホイールイベント(MouseWheel)を登録しています。
サンプルプログラムでは、ピクチャボックスのイベントとして追加しています。

this.pictureBox1.MouseWheel += new System.Windows.Forms.MouseEventHandler(this.pictureBox1_MouseWheel);

実際のイベント処理を行う部分は

private void pictureBox1_MouseWheel(object sender, MouseEventArgs e)
{

}

ここで、一つ注意点があり、これだけではMouseWheelにイベントが入ってくれません。
MouseWheelイベントを発生させるには、明示的にイベントを発生させるオブジェクト(サンプルではpictureBox1)にフォーカスを設定する必要があります。

そこで、サンプルではpictureBox1_Clickイベントでフォーカスを設定しています。

private void pictureBox1_Click(object sender, EventArgs e)
{
        // ピクチャボックスにフォーカスを移す
        pictureBox1.Focus();
}


実行画面
マウスホイールイベントの追加方法
Loading...
スポンサーリンク

スポンサーリンク 最近の記事
(09/18)  計測測定展に光切断のデモを出展しました
(08/17)  ディジタル画像技術事典200に記事が載りました
(06/09)  光切断を画像センシング展で公開
(05/14)  中国(上海)へ行って来ました
(04/12)  韓国へ行って来ました
(03/10)  私の求める新人像
(01/18)  エレクトロテストジャパンにカラー光切断法のデモを出展しました。
(12/23)  ユニークアクセス200万達成!
(12/10)  【カラー光切断法】YouTube動画まとめ
(11/04)  国際画像機器展2014にカラー光切断法を出展します。
(10/05)  第25回コンピュータビジョン勉強会@関東に参加してきました。
(09/08)  フーリエ変換の記事を追加しました。
(08/09)  【画像処理】ランキング低下中
(07/06)  記事の更新が停滞中...
(06/08)  画像センシング展2014でカラー光切断法のデモを行います。
(05/17)  カラー光切断法の動画を公開しました。
(04/30)  ソニーα NEX-5Rで星空撮影
(04/10)  カラー光切断法の取込結果を追加しました
(03/08)  Korea Vision Show 2014へ行ってきました
(02/05)  フーリエ変換シリーズを始めます。
(01/06)  2014年、あけましておめでとうございます。
(12/04)  カラー光切断法を公開(国際画像機器展2013にて)
(11/13)  国際画像機器展2013に出展します
(10/14)  「画像処理のためのC#」はじめます。
(09/16)  【C#,VB.NET】高速描画コントロールをバージョンアップしました。
(09/04)  拡大鏡に輝度値表示、ルーラー機能を追加した個人ツールを公開
(08/05)  7月の拍手Top5
(07/06)  2013年6月人気記事Top5
(05/12)  SONY α NEX-5Rレビュー
(04/24)  SONY α NEX-5RY購入

【.NET】Graphicsオブジェクトのアフィン変換(グローバル変換)

メインページC++/CLI プログラミング

前回、アフィン変換について説明しましたが、.NETプログラミング(VB.NET、C#、C++/CLI)においてもアフィン変換が用意されているのですが、マイクロソフトだけはDirectXも含めて、ちょっと特殊な行列表現をします。
このマイクロソフトで用いるアフィン変換の行列は、変換前の座標を(x, y)、変換前の座標を(x', y')とすると

.NETのアフィン変換

のように表現します。
この時の座標系は、ピクチャボックス等の左上が原点で時計回りが正の回転方向となります。

.NETのアフィン変換

X軸方向へTx、Y軸方向へTyだけ移動する平行移動の変換行列をTとすると、

  .NETのアフィン変換

X軸方向へSx倍、Y軸方向へSy倍だけ拡大する変換行列をSとすると、

  .NETのアフィン変換
原点まわりにθ°回転移動する変換行列をRとすると

  .NETのアフィン変換

のように表現されます。
この表現方法は、あくまでもマイクロソフトだけなので、一般的なアフィン変換と混同しないようにご注意下さい。

また、.NET Frameworkでは、それぞれGraphicsオブジェクトに対して、それぞれの変換を行うメソッドが用意されています。

平行移動はTranslateTransform
拡大縮小はScaleTransform
回転移動はRotateTransform

を用います。
また、行列を用いて変換しているので、行列を掛ける順番(平行移動や回転移動をする順番)が異なると結果も異なるのでご注意下さい。

C++/CLIのサンプルコード

【平行移動してから回転移動した場合】
// ビットマップファイルの読み込み
Bitmap^ bmp = gcnew Bitmap("Lenna.bmp");
// グラフィックオブジェクトの作成
Graphics^ g = pictureBox1->CreateGraphics();
// ワールド変換行列を単位行列にリセット
g->ResetTransform();
// 平行移動
g->TranslateTransform(100, 0, Drawing2D::MatrixOrder::Append);
// 20°回転
g->RotateTransform(20, Drawing2D::MatrixOrder::Append);
// 画像の描画
g->DrawImage(bmp, 0, 0);

(処理結果)
.NETのアフィン変換

回転移動してから平行移動した場合】
// ビットマップファイルの読み込み
Bitmap^ bmp = gcnew Bitmap("Lenna.bmp");
// グラフィックオブジェクトの作成
Graphics^ g = pictureBox1->CreateGraphics();
// ワールド変換行列を単位行列にリセット
g->ResetTransform();
// 20°回転
g->RotateTransform(20, Drawing2D::MatrixOrder::Append);
// 平行移動
g->TranslateTransform(100, 0, Drawing2D::MatrixOrder::Append);
// 画像の描画
g->DrawImage(bmp, 0, 0);

(処理結果)
.NETのアフィン変換
また、変換行列を直接指定してアフィン変換を行う事も可能です。
ただし、変換行列は最初に説明したマイクロソフト特有の変換行列です。

変換行列を直接指定した場合】
// ビットマップファイルの読み込み
Bitmap^ bmp = gcnew Bitmap("Lenna.bmp");
// グラフィックオブジェクトの作成
Graphics^ g = pictureBox1->CreateGraphics();
// ワールド変換行列を単位行列にリセット
g->ResetTransform();
// 回転行列
float CosTh = Math::Cos(20.0 / 180.0 * Math::PI);
float SinTh = Math::Sin(20.0 / 180.0 * Math::PI);
// 回転→平行移動の行列
Drawing2D::Matrix^ matRot
         = gcnew Drawing2D::Matrix(
                    CosTh,  SinTh,
                    -SinTh, CosTh,
                    100.0f, 0.0f
                    );
// 変換行列を指定
g->Transform = matRot;
// 画像の描画
g->DrawImage(bmp, 0, 0);

(処理結果)
.NETのアフィン変換

参考記事
http://msdn.microsoft.com/ja-jp/library/8667dchf%28v=VS.100%29.aspx
http://msdn.microsoft.com/ja-jp/library/c499ats3%28v=vs.80%29.aspx

Loading...
スポンサーリンク

スポンサーリンク 最近の記事
(09/18)  計測測定展に光切断のデモを出展しました
(08/17)  ディジタル画像技術事典200に記事が載りました
(06/09)  光切断を画像センシング展で公開
(05/14)  中国(上海)へ行って来ました
(04/12)  韓国へ行って来ました
(03/10)  私の求める新人像
(01/18)  エレクトロテストジャパンにカラー光切断法のデモを出展しました。
(12/23)  ユニークアクセス200万達成!
(12/10)  【カラー光切断法】YouTube動画まとめ
(11/04)  国際画像機器展2014にカラー光切断法を出展します。
(10/05)  第25回コンピュータビジョン勉強会@関東に参加してきました。
(09/08)  フーリエ変換の記事を追加しました。
(08/09)  【画像処理】ランキング低下中
(07/06)  記事の更新が停滞中...
(06/08)  画像センシング展2014でカラー光切断法のデモを行います。
(05/17)  カラー光切断法の動画を公開しました。
(04/30)  ソニーα NEX-5Rで星空撮影
(04/10)  カラー光切断法の取込結果を追加しました
(03/08)  Korea Vision Show 2014へ行ってきました
(02/05)  フーリエ変換シリーズを始めます。
(01/06)  2014年、あけましておめでとうございます。
(12/04)  カラー光切断法を公開(国際画像機器展2013にて)
(11/13)  国際画像機器展2013に出展します
(10/14)  「画像処理のためのC#」はじめます。
(09/16)  【C#,VB.NET】高速描画コントロールをバージョンアップしました。
(09/04)  拡大鏡に輝度値表示、ルーラー機能を追加した個人ツールを公開
(08/05)  7月の拍手Top5
(07/06)  2013年6月人気記事Top5
(05/12)  SONY α NEX-5Rレビュー
(04/24)  SONY α NEX-5RY購入

アフィン変換

メインページ画像処理

画像の拡大縮小、回転、平行移動などをまとめて3×3の行列を使って変換する事をアフィン変換と呼びます。

変換前の座標を(x, y)
変換後の座標を(x',y')

とすると、アフィン変換では
アフィン変換

のように実質的には2行3列の行列を使って変換します。

変換前の画像を以下のようにすると、

  アフィン変換

拡大縮小

X軸方向の拡大率をSx、Y軸方向の拡大率をSyとすると拡大縮小のアフィン変換は

アフィン変換

と表されます。

例)X軸方向に2倍
アフィン変換
  アフィン変換

例)Y軸方向に2倍

アフィン変換
  アフィン変換

例)X軸、Y軸方向に2倍
アフィン変換
  アフィン変換

例)Y軸方向に-1倍
アフィン変換
  アフィン変換
  このように、ある軸(上記の例ではX軸)に対して反転する処理の事を鏡映と呼びます。

平行移動

X軸方向にTx、Y軸方向にTyだけ移動するアフィン変換は

アフィン変換

のように表されます。
アフィン変換

回転

原点を中心に反時計回りにθ°回転する時のアフィン変換は

アフィン変換

のように表されます。
  アフィン変換

スキュー(せん断)

四角形の画像を平行四辺形に変形する処理をスキューまたはせん断といいます。
このアフィン変換は

アフィン変換
  アフィン変換

アフィン変換
    アフィン変換

注意点

アフィン変換では任意の3×3(2×3)の行列で表す事ができるので、任意形状に変換できそうにも思えるのですが、四角形が平行四辺形にまでは変形できるものの、台形には変形できないのでご注意願います。
この台形に変形できる処理は射影変換(ホモグラフィ)と呼びます。

  アフィン変換

また、実際に画像データをアフィン変換にて変換する場合は、アフィン変換の行列の式の両辺に3×3の逆行列を掛け、変換前の座標(x, y)と変換後の座標(x',y')を逆にして、変換後の座標から変換前の座標を求めます。

アフィン変換

このようにして変換すると、変換前の座標は1で割り切れない座標になる場合があるので、biLinear、biCubicなどの補間処理をして、座標と座標の間の輝度値を求めます。
(参考)
画素の補間(Nearest neighbor,Bilinear,Bicubic)
画像の回転

Loading...
スポンサーリンク



現在の閲覧者数: / 合計