C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[41]: 拡縮した画像の上にRectangle [1]


(過去ログ 50 を表示中)

[トピック内 54 記事 (21 - 40 表示)]  << 0 | 1 | 2 >>

■27302 / inTopicNo.21)  Re[19]: 拡縮した画像の上にRectangle
  
□投稿者/ 猫 (32回)-(2008/11/03(Mon) 11:43:28)
No27299 (ま さん) に返信

すいません。
書き忘れていました。

CPUウェハーの塵検出と言われても、なんのことだかわかりません、、
それが出来れば、どういったことが出来るのですか?

また、入力画像サイズは、特に規定するつもりはありませんでしたが、
100万×100万ドットのやつを使われたりすると何か問題があるのですか?


引用返信 編集キー/
■27303 / inTopicNo.22)  Re[20]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (34回)-(2008/11/03(Mon) 13:05:02)
ページが変わっちゃたので、
見やすさを考慮して最新の質問をもう一度書かせていただきます。

No27299 (ま さん) に返信

まさん、返信ありがとうございます。

まさに、まさんのおっしゃる通り将来的には
『サムネイル(全体画像)の上に十字カーソル置いて、
そのカーソルの前後左右100ドット近辺を拡大する』
という仕掛けを作りたいと思っています。
それを実装するのはむずかしいでしょうか?

ま、そのためにもまず、picturebox上の好きな点に、
Rectangleを描画出来るようにして、
画像の拡大とRectangleの拡大の同期を早く実現したいのですが、、

どうしても、pictureboxのセンターを原点にしたRectangleを描画出来ないし、
WidthとHeightは同じ値にしたはずなのに正方形にならないんです。
(ちなみに、Rectangleにとっての原点をpictureboxのセンターにしたい理由は、
Rectangleでは、マイナスの値が入っても描画したいためです;;)

どうかお助けください。
お願いします。



引用返信 編集キー/
■27304 / inTopicNo.23)  Re[21]: 拡縮した画像の上にRectangle
□投稿者/ 通りがかり (1回)-(2008/11/03(Mon) 14:13:42)
No27303 (猫 さん) に返信
> ページが変わっちゃたので、
> 見やすさを考慮して最新の質問をもう一度書かせていただきます。
>

>
> どうしても、pictureboxのセンターを原点にしたRectangleを描画出来ないし、
> WidthとHeightは同じ値にしたはずなのに正方形にならないんです。




あなたのモニターの縦横表示VRを調節したらなおりませんか?


> (ちなみに、Rectangleにとっての原点をpictureboxのセンターにしたい理由は、
> Rectangleでは、マイナスの値が入っても描画したいためです;;)
>

pictureboxの表示領域の幅をx1、高さをy1とする。
Rectangleの幅をx2、高さをy2とする。
中央に表示の場合Rectangleの左上の角の座標(x、y)は
x = (x1-x2)/2
y = (y1-y2)/2

この式は常式です。(常識?)

引用返信 編集キー/
■27305 / inTopicNo.24)  Re[19]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (312回)-(2008/11/03(Mon) 14:16:35)
2008/11/03(Mon) 15:31:56 編集(投稿者)
2008/11/03(Mon) 15:29:05 編集(投稿者)

> どうしても、pictureboxのセンターを原点にしたRectangleを描画出来ないし、

僕のサンプルソースじゃダメ?
センター原点に描画してますけど。

http://msdn.microsoft.com/ja-jp/library/system.drawing.graphics.drawimage(vs.80).aspx
DrawImage使えば、拡大縮小も、画像の任意の場所をとりだして描画できますし。

>WidthとHeightは同じ値にしたはずなのに正方形にならないんです。

僕のは正方形になってませんでした?

てか、TranslateTransformって、調べたらワールド変換ですよね。逆に難しいですよこれ。

猫さんのソースですが。
graph.TranslateTransform(pictureBox1.Width / 2, pictureBox1.Height / 2);
rectangle = new Rectangle(0, 0, 100, 100);
graph.DrawRectangle(Pens.Red, rectangle);
これは何をしているか理解されています?
ワールド座標系をピクチャーボックスの真ん中に移動させて、それから四角形を書いてるんですから、そら中央に書かれませんよ。

TranslateTransformを使わないことをお勧めします。
引用返信 編集キー/
■27306 / inTopicNo.25)  Re[22]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (35回)-(2008/11/03(Mon) 16:29:47)
No27305 (倉田 有大 さん) に返信

通りがかりさん、
倉田さん、返信ありがとうございます。

倉田さんに改良していただいたまさんのコードでは、
画像を拡大した時Rectangleは一緒に拡大してくれないように思うのですが、
DrawImageを使えばそれも可能なのですか?

試しに次の物を実現させるには、DrawImageをどのように使えばいいんでしょうか?
『(x,y,width,height)のバラバラの複数のRectangleと、
拡大ボタンを作って、それをクリックしたときに、
拡大したいRectangleのセンターを中心に前後左右100ドット近辺を拡大する』

どうかご教授お願いします。


引用返信 編集キー/
■27307 / inTopicNo.26)  Re[23]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (313回)-(2008/11/03(Mon) 17:32:42)
> 倉田さんに改良していただいたまさんのコードでは、
> 画像を拡大した時Rectangleは一緒に拡大してくれないように思うのですが、
> DrawImageを使えばそれも可能なのですか?

あのままでは拡大してくれませんよ。
猫さんがどのように拡大縮小機能を作るのかわからないので、現状ではあれ以上できません。

> 試しに次の物を実現させるには、DrawImageをどのように使えばいいんでしょうか?
> 『(x,y,width,height)のバラバラの複数のRectangleと、
> 拡大ボタンを作って、それをクリックしたときに、
> 拡大したいRectangleのセンターを中心に前後左右100ドット近辺を拡大する』

ちょっと先走りしすぎです。
将来は複数の四角形を配置するんですか?
DrawImageをどのように使えばいいかは、実際にDrawImageを調べてみてください。
まだ任意の場所に四角形をかけない現状じゃ、僕にはアドバイスのしようがありません。

graph.TranslateTransform(pictureBox1.Width / 2, pictureBox1.Height / 2);
rectangle = new Rectangle(0, 0, 100, 100);
graph.DrawRectangle(Pens.Red, rectangle);

とりあえず、ここを直して、TranslateTransformを使わずに、中央に四角形がかけるように直すことをお勧めします。
自分で、正確に座標を計算して、描画できるようにならないと猫さんのしたいことは実装できません。

画像を扱うのはなにげに難しいですよ。あわてずゆっくりとプログラムしていくことをお勧めします。
引用返信 編集キー/
■27312 / inTopicNo.27)  Re[24]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (36回)-(2008/11/03(Mon) 18:43:15)
2008/11/03(Mon) 18:44:01 編集(投稿者)
No27307 (倉田 有大 さん) に返信

倉田さん、返信ありがとうございます。
倉田さんのご助言の通り、自分のソースコードを修正して、
3つのRectangleを好きな場所に配置することには成功しました。
(※今回の投稿文の最後にそのコードを記載します)
あと知りたいのは、画像拡大機能です。
(ただし、画像拡大時にはRectangleも一緒に拡大してほしい)
【拡大の仕方としては、任意のRectangleの
センターを中心に前後左右100ドット近辺を拡大するです。】
このやりかたまで理解できたら、
自分の作ろうとしているツールが作り上げることができそうですので、
どうか、この点までご教授をお願いできませんでしょうか?
よろしくお願いします。

猫

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;

namespace sample
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        //表示する画像
        private Bitmap img;
        //画像を表示させる範囲
        private Rectangle imgRect;
        //表示させるレクタングルの表示範囲
        private Rectangle[] rectangle;

        //画像描画ボタン
        private void ImagePaintButton_Click(object sender, EventArgs e)
        {
            img = new Bitmap(@"c:\test.jpg");
            float ratioW = (float)pictureBox1.Width / img.Width;
            float ratioH = (float)pictureBox1.Height / img.Height;
            int nw = Convert.ToInt32(img.Width * ratioW);
            int nh = Convert.ToInt32(img.Height * ratioH);
            imgRect = new Rectangle(0, 0, nw, nh);
            pictureBox1.Invalidate();

            pictureBox1.Paint += new PaintEventHandler(PicPaint);
        }

        private void pictureBox1_Paint(object sender, PaintEventArgs e)
        {
            if (img != null)
            {
                e.Graphics.DrawImage(img, imgRect);
            }
        }

        void PicPaint(object o, PaintEventArgs e)
        {
            rectangle = new Rectangle[3];

            rectangle[0].X = pictureBox1.Width - 150;
            rectangle[0].Y = pictureBox1.Height - 150;
            rectangle[1].X = pictureBox1.Width;
            rectangle[1].Y = pictureBox1.Height;
            rectangle[2].X = pictureBox1.Width + 150;
            rectangle[2].Y = pictureBox1.Height + 150;

            for (int i = 0; i < 3; i++)
            {
                rectangle[i].Width = 50;
                rectangle[i].Height = 50;
                rectangle[i].X = (rectangle[i].X - rectangle[i].Width) / 2;
                rectangle[i].Y = (rectangle[i].Y - rectangle[i].Height) / 2;

                e.Graphics.DrawRectangle(Pens.Red, rectangle[i]);
            }
        }

        //画像拡大ボタン
        private void ExpandImageBotton_Click(object sender, EventArgs e)
        {
            //任意のRectangle(例えば上で3つ描画しているRectangleのうち、Rectangle[0])の
            //センターを中心に前後左右100ドット近辺を拡大する機能を実装したいです。
            //どうすればよいでしょうか?
        }
    }
}

引用返信 編集キー/
■27314 / inTopicNo.28)  Re[25]: 拡縮した画像の上にRectangle
□投稿者/ やじゅ (744回)-(2008/11/03(Mon) 19:12:30)
やじゅ さんの Web サイト
No27312 (猫 さん) に返信
> あと知りたいのは、画像拡大機能です。
> (ただし、画像拡大時にはRectangleも一緒に拡大してほしい)
>

枠の拡大って、枠すら拡大して表示するのか、
対象の画像は拡大して、枠は細線のままにするとか2通りあると思います。

まずは、別のPaintBoxに指定した位置の画像範囲をコピーしてから
拡大させてみることですね。
一度に一気にやらずに、段階を得てからやっていくといいでしょう。

画像の加工
・画像の一部を切り取って表示する
・クリッピング領域を指定して画像の一部を表示する
・ワールド変換により画像を平行移動、拡大、縮小、回転して表示する
http://dobon.net/vb/dotnet/graphics/
引用返信 編集キー/
■27317 / inTopicNo.29)  Re[26]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (37回)-(2008/11/03(Mon) 19:46:52)
No27314 (やじゅ さん) に返信

やじゅさん、返信ありがとうござます。

Rectangle枠の太さも当然太くなります。
画像の上にRectangleを貼り付けているイメージですので。

私のしたいことは、別のPaintBoxに指定した位置の画像範囲をコピーするという
かなりパフォーマンス的には無駄な事をしないと実現しないのでしょうか?


引用返信 編集キー/
■27319 / inTopicNo.30)  Re[27]: 拡縮した画像の上にRectangle
□投稿者/ 通りがかり (2回)-(2008/11/03(Mon) 20:00:16)
2008/11/03(Mon) 20:08:07 編集(投稿者)

親切な私が教えてあげる。

1.センターの座標を習得
2.ScaleTransformで拡大率を決める
  TranslateTransformで位置をきめる
3.センターに画像を描画する
4.ScaleTransform、TranslateTransformを元にもどす

私の記憶が正しければ、描画したとき
拡大、縮小される。
描画してない部分は拡大されない。

*縮小は難しいよ

参考
http://dobon.net/vb/dotnet/graphics/transform.html

以上。
引用返信 編集キー/
■27320 / inTopicNo.31)  Re[27]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (315回)-(2008/11/03(Mon) 20:05:19)
2008/11/03(Mon) 20:14:13 編集(投稿者)

No27317 (猫 さん) に返信
> ■No27314 (やじゅ さん) に返信
>
> やじゅさん、返信ありがとうござます。
>
> Rectangle枠の太さも当然太くなります。
> 画像の上にRectangleを貼り付けているイメージですので。
>
> 私のしたいことは、別のPaintBoxに指定した位置の画像範囲をコピーするという
> かなりパフォーマンス的には無駄な事をしないと実現しないのでしょうか?

ちがいます。やじゅさんは猫さんに画像を扱う練習をしてくださいといっているのですよ。
答えをあわてて知りたがる質問はいけません、まわりから敬遠されてしまいます。
みんな、自分で時間をかけていろいろ試しているんですよ。C#を私がまとも?に扱えるのにも何年もかかってますし。

http://msdn.microsoft.com/ja-jp/library/ms142038(VS.80).aspx

↑これのC#サンプルでいけるんじゃないでしょうか?
ためしたら、抜き出しも拡大も出来そうですね。
引用返信 編集キー/
■27322 / inTopicNo.32)  Re[28]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (317回)-(2008/11/03(Mon) 20:32:44)
あれ、サンプルみたら、私のソースを改良してるんですね。
最初の猫さんのソースを改良した方がいいです。
元画像に四角形を描画するので、DrawImageで書いたとき、元画像と一緒に四角形も拡大されます。
引用返信 編集キー/
■27325 / inTopicNo.33)  Re[29]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (38回)-(2008/11/03(Mon) 21:06:58)
2008/11/03(Mon) 21:08:17 編集(投稿者)
No27322 (倉田 有大 さん) に返信

通りがかりさん、
倉田さん返信ありがとうございます。

私の初投稿のソースを、
倉田さんのソースを参考に改良しても
最初の2つの問題
(widthとheightが同じでも長方形になる
x=0、y=0のRectangleがセンターに描画されない)
が改善できませんでした;;

下記に記載しますが何がいけないのでしょうか?
あでも、画像とRectangleの拡縮は同期しました。


using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Text;
using System.Windows.Forms;

namespace honto
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        //表示する画像
        private Bitmap img;
        //画像を表示させる範囲
        private Rectangle imgRect;
        //表示させるレクタングルの表示範囲
        private Rectangle[] rectangle;

        //画像描画ボタン
        private void ImagePaintButton_Click(object sender, EventArgs e)
        {
            img = new Bitmap(@"c:\test.jpg");
            float ratioW = (float)pictureBox1.Width / img.Width;
            float ratioH = (float)pictureBox1.Height / img.Height;
            int nw = Convert.ToInt32(img.Width * ratioW);
            int nh = Convert.ToInt32(img.Height * ratioH);
            imgRect = new Rectangle(0, 0, nw, nh);
            pictureBox1.Invalidate();

            //pictureBox1.Paint += new PaintEventHandler(PicPaint);

            Graphics graph = Graphics.FromImage(img);

            rectangle = new Rectangle[3];

            rectangle[0].X = pictureBox1.Width - 150;
            rectangle[0].Y = pictureBox1.Height - 150;
            rectangle[1].X = pictureBox1.Width;
            rectangle[1].Y = pictureBox1.Height;
            rectangle[2].X = pictureBox1.Width + 150;
            rectangle[2].Y = pictureBox1.Height + 150;

            for (int i = 0; i < 3; i++)
            {
                rectangle[i].Width = 50;
                rectangle[i].Height = 50;
                rectangle[i].X = (rectangle[i].X - rectangle[i].Width) / 2;
                rectangle[i].Y = (rectangle[i].Y - rectangle[i].Height) / 2;

                graph.DrawRectangle(Pens.Red, rectangle[1]);
            }

            graph.Dispose();            
        }

        private void pictureBox1_Paint(object sender, PaintEventArgs e)
        {
            if (img != null)
            {
                e.Graphics.DrawImage(img, imgRect);
            }
        }

        //画像拡大ボタン
        private void ExpandImageBotton_Click(object sender, EventArgs e)
        {
            //任意のRectangle(例えば上で3つ描画しているRectangleのうち、Rectangle[0])の
            //センターを中心に前後左右100ドット近辺を拡大する機能を実装したいです。
            //どうすればよいでしょうか?
        }
    }
}

猫

引用返信 編集キー/
■27326 / inTopicNo.34)  Re[30]: 拡縮した画像の上にRectangle
□投稿者/ やじゅ (745回)-(2008/11/03(Mon) 21:31:43)
やじゅ さんの Web サイト
2008/11/03(Mon) 21:50:06 編集(投稿者)

>■No27325 (猫 さん) に返信
>
> (widthとheightが同じでも長方形になる
> x=0、y=0のRectangleがセンターに描画されない)

> ■No27304 (通りがかりさん)
> あなたのモニターの縦横表示VRを調節したらなおりませんか?
先ず、知りたいのが、上記で通りがかりさんが指摘していた件は
どうなんでしょうか?

このソースにとは関係なく、単純な四角形を描いた場合にも
長方形になってしまうのでしょうか?
長方形とは、どのくらい比率が違うのでしょうか?
Paintソフトを使って同じサイズにした場合と比べて違うので
しょうか?
画面のアスペクト比(たてよこの画素数比率)の関係もあるし。

文字表現が難しければ、どこかのサイトで、画像を貼り付ける
などして、みなが見れるようにするなど、工夫してみてください。
引用返信 編集キー/
■27327 / inTopicNo.35)  Re[31]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (39回)-(2008/11/03(Mon) 22:03:51)
No27326 (やじゅ さん) に返信

やじゅさん、返信ありがとうございます。

私のモニターの縦横表示VRに問題はありません。
ご助言の通り、
http://lovestube.com/up/src/up1544.jpg
に■27325で投稿したソースの実行画面をアップしていますので、
是非ご覧の上改善策をご教授いただければありがたいです。
よろしくお願いします。


引用返信 編集キー/
■27328 / inTopicNo.36)  Re[32]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (319回)-(2008/11/03(Mon) 22:25:44)
2008/11/03(Mon) 22:27:15 編集(投稿者)

No27327 (猫 さん) に返信
> ■No27326 (やじゅ さん) に返信
>
> やじゅさん、返信ありがとうございます。
>
> 私のモニターの縦横表示VRに問題はありません。
> ご助言の通り、
> http://lovestube.com/up/src/up1544.jpg
> に■27325で投稿したソースの実行画面をアップしていますので、
> 是非ご覧の上改善策をご教授いただければありがたいです。
> よろしくお願いします。
>
> 猫

縦長になってますが、画像も縦長で描画されてます?
僕のソースの時は正方形でした?
引用返信 編集キー/
■27329 / inTopicNo.37)  Re[33]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (40回)-(2008/11/03(Mon) 22:39:31)
2008/11/03(Mon) 23:01:02 編集(投稿者)

No27328 (倉田 有大 さん) に返信

倉田さん、返信ありがとうございます。

ええ、倉田さんのソースを改良した■27312を実行すると
次のページのように形と位置は正常に表示されました。
http://lovestube.com/up/src/up1545.jpg
しかし、これでは、画像の拡大した時に
Rectangleは一緒に拡大してくれませんでした。


引用返信 編集キー/
■27330 / inTopicNo.38)  Re[34]: 拡縮した画像の上にRectangle
□投稿者/ 倉田 有大 (320回)-(2008/11/03(Mon) 23:01:54)
2008/11/03(Mon) 23:03:51 編集(投稿者)

float ratioW = (float)pictureBox1.Width / img.Width;
float ratioH = (float)pictureBox1.Height / img.Height;
int nw = Convert.ToInt32(img.Width * ratioW);
int nh = Convert.ToInt32(img.Height * ratioH);
imgRect = new Rectangle(0, 0, nw, nh);

これが悪いです。
上記を全部消して
imgRect = new Rectangle(0, 0, img.Width, img.Height);
これに入れ替えてみてください。
拡大縮小されませんが、正方形で出るはず。

最初の猫さんの方法だと、縦横の比率がかわりますがいいんですか?

というか、順番がわからない。
画像をピクチャーボックスの大きさに合わせて表示させたいんですよね?
画像の比率は無視して表示?それとも比率は保ったまま表示?
どっちの場合も、pictureBoxに合わせて、まずBitmapオブジェクトを作成し直した方がいいです。
それから、四角形を上に書いてやります。


引用返信 編集キー/
■27331 / inTopicNo.39)  Re[35]: 拡縮した画像の上にRectangle
□投稿者/ 猫 (41回)-(2008/11/03(Mon) 23:20:29)
No27330 (倉田 有大 さん) に返信

倉田さん、返信ありがとうございます。

float ratioW = (float)pictureBox1.Width / img.Width;
float ratioH = (float)pictureBox1.Height / img.Height;
int nw = Convert.ToInt32(img.Width * ratioW);
int nh = Convert.ToInt32(img.Height * ratioH);
imgRect = new Rectangle(0, 0, nw, nh);
を消したら正常に表示されることは分かっていました。

しかし、画像をpictureboxサイズに拡縮させるのは絶対組み込みたいんです。
できれば、画像の比率維持したまま、pictureboxサイズにリサイズしたいのですが、
その方法が分からず、比率を無視して拡縮しています。

どっちの場合も、pictureBoxに合わせて、まずBitmapオブジェクトを作成し直おす
というのは具体的にはどうやってすえばいいんでしょうか?
どうかご教授ください。


引用返信 編集キー/
■27332 / inTopicNo.40)  Re[36]: 拡縮した画像の上にRectangle
 
□投稿者/ 倉田 有大 (321回)-(2008/11/03(Mon) 23:47:27)
2008/11/03(Mon) 23:49:07 編集(投稿者)

> しかし、画像をpictureboxサイズに拡縮させるのは絶対組み込みたいんです。
> できれば、画像の比率維持したまま、pictureboxサイズにリサイズしたいのですが、
> その方法が分からず、比率を無視して拡縮しています。

そら、画像のはみ出さない方の比率で画像を縮小するんですよ。
縦と横を同じ比率で割るんですよ。そうすれば、比率は保たれます。

adjustWindowSize(
image.Width,
image.Height,
pictureBoxWidth,
pictureBosHeight,
ref width,
ref height
);

public static void adjustWindowSize(int width1, int height1, int width2, int height2, ref int getWidth,ref int getHeight)
{
double hiritu1 = (double)width2 / height2;
double hiritu2 = (double)width1 / height1;
if (hiritu1 >= hiritu2)
{
getHeight = height2;
getWidth = (int)(width1 / ((double)height1 / height2));

}
else
{
getWidth = width2;
getHeight = (int)(height1 / ((double)width1 / width2));
}
}


比率を保ったまま、ピクチャーボックスの大きさに合わせたwidthとheightを計算する関数です。

> どっちの場合も、pictureBoxに合わせて、まずBitmapオブジェクトを作成し直おす
> というのは具体的にはどうやってすえばいいんでしょうか?
> どうかご教授ください。

Image dstImage = new System.Drawing.Bitmap(
width,
height
);

System.Drawing.Graphics g = System.Drawing.Graphics.FromImage(dstImage);
g.DrawImage(image, 0, 0, dstImage.Width, dstImage.Height);
g.Dispose();

こんな感じ。



もう!ゴールしていいよね!?
引用返信 編集キー/

<前の20件 | 次の20件>
トピック内ページ移動 / << 0 | 1 | 2 >>

管理者用

- Child Tree -