Coordinate mismatch between thumbnail and unscaled image

LaughingSeraphim

New member
Joined
Aug 16, 2016
Messages
3
Programming Experience
1-3
Hello,

I have an unscaled blueprint streamed into an image control(BackBuffer) (fit to image). I have a visible preview set to 'zoom' that displays that image as a large thumbnail(viewPort).
I use mouse events to capture a rectangle on the thumbnail or preview image.

I am attempting to scale that captured rectangle to copy the corresponding region of the backbuffer onto another imagebox(zoom_Box).

Desired Behavior: I select a region on the thumbnail(viewport), and grab that scaled region to draw(from backBUffer) onto a second preview(zoom_Box).
Current Behavior: The region that displays or is copied from the unscaled image(BackBuffer) is offset, an offset that increases(Further proportionally to the left) the more I stray from the thumbnails center. Thus if I select the center of the thumbnail(viewport) I get close to selected center of the larger img. If I select the lower right corner(of ViewPort), I get a massively offset region of the image(from Backbuffer drawn into zoom_box). It seems like it's offset by the width of the initial selection on the thumbnail, scaled.

Efforts Made:
I have read through roughly two dozen answers or the past two weeks, downloaded and attempted to use several example projects. I have attempted several methods of calculating the scale of the rects. I have tried several graphics methods so far.

Example:
A rect of (10,10,100,50) on the 1/5th scale image preview should translate to a rect of (50,50,500,250) on the larger image. The actual region being pulled from the larger image is offset tremendously, despite the coordinates seeming to match up. The further from center the selected region is, the further *left* the image is offset when drawn. Thus, selecting the middle I'll get about a half width of the selection in offset. If I select the lower right corner, I get a region of the backbuffer that is left of center and a fourth of the way up...

My code is this

C#:
//On loading of an image, I get the scale values. I've tried all 3 methods below
[I]              scaleToBufferX[/I] = (([COLOR=#ff0000][B]float[/B][/COLOR])[I]BackBuffer[/I].Image.Width / [I]ViewPort[/I].ClientSize.Width );
              [I]scaleToBufferY[/I] = (([COLOR=#ff0000][B]float[/B][/COLOR])([I]BackBuffer[/I].Image.Height) / [I]ViewPort[/I].ClientSize.Height );
              [I]//resizeFactor[/I] = [COLOR=#004085]Math[/COLOR].[COLOR=#191970][B]Max[/B][/COLOR]([I]scaleToBufferX[/I],[I]scaleToBufferY[/I]);
              //[I]ScaleOf_X[/I] = ([COLOR=#ff0000][B]int[/B][/COLOR])([I]BackBuffer[/I].Image.Width / [I]resizeFactor[/I]);
              //[I]ScaleOf_Y[/I] = ([COLOR=#ff0000][B]int[/B][/COLOR])([I]BackBuffer[/I].Image.Height / [I]resizeFactor[/I]);

//I scale the rectangle to determine the area I will paint from in the next step
              [COLOR=#004085][B]Rectangle[/B][/COLOR] zoomArea = [COLOR=#008b8b][B]new[/B][/COLOR] [COLOR=#004085][B]Rectangle[/B][/COLOR](
                    ([COLOR=#ff0000][B]int[/B][/COLOR])((([I]StartX[/I])*[I]scaleToBufferX[/I]))
                    ,([COLOR=#ff0000][B]int[/B][/COLOR])((([I]StartY[/I])*[I]scaleToBufferY[/I]))
                    ,([COLOR=#ff0000][B]int[/B][/COLOR])((([I]EndX[/I]*[I]scaleToBufferX[/I])-([I]StartX[/I])*[I]scaleToBufferX[/I]))
                    ,([COLOR=#ff0000][B]int[/B][/COLOR])((([I]EndY[/I]*[I]scaleToBufferY[/I])-([I]StartY[/I])*[I]scaleToBufferY[/I]))
                                                    
     //I call the func to return the region of the larger image                                             );
[COLOR=#0000ff][B]if[/B][/COLOR]([I]loadedImage[/I] != [B]null[/B])
               {
               [I]PreviewBuffer[/I].Image = [COLOR=#191970][B]ZoomImage[/B][/COLOR]([I]loadedImage[/I], zoomArea);
               [I]zoom_Box[/I].Image = [I]PreviewBuffer[/I].Image;
               [I]zoom_Box[/I].[COLOR=#191970][B]Refresh[/B][/COLOR]();
               }

     [COLOR=#0000ff][B]private[/B][/COLOR] [COLOR=#004085]Image[/COLOR] [COLOR=#191970][B]ZoomImage[/B][/COLOR]([COLOR=#004085]Image[/COLOR] input, [COLOR=#004085][B]Rectangle[/B][/COLOR] zoomArea)
        {
               
                   //I have tried these methods, plus cloning the bitmap. I have also tried passing the width and height of the zoomarea to new Bitmap(h,w)
               [COLOR=#004085]Bitmap[/COLOR] newBmp = [COLOR=#008b8b][B]new[/B][/COLOR] [COLOR=#004085]Bitmap[/COLOR]([COLOR=#00008b]1024[/COLOR],[COLOR=#00008b]1024[/COLOR]);
             [COLOR=#008000]//Bitmap newBmp = new Bitmap(zoom_Box.ClientSize.Width,zoom_Box.ClientSize.Width);               [/COLOR]
               [COLOR=#004085]Graphics[/COLOR] g = [COLOR=#004085]Graphics[/COLOR].[COLOR=#191970][B]FromImage[/B][/COLOR](newBmp);
               g.[COLOR=#191970][B]DrawImage[/B][/COLOR](input,[COLOR=#008b8b][B]new[/B][/COLOR] [COLOR=#004085][B]Rectangle[/B][/COLOR]([COLOR=#00008b]0[/COLOR],[COLOR=#00008b]0[/COLOR],[COLOR=#00008b]1024[/COLOR],[COLOR=#00008b]1024[/COLOR]),zoomArea,[COLOR=#004085][B]GraphicsUnit[/B][/COLOR].[I]Pixel[/I]);

               [I]OldFileNameLabel[/I].Text = zoomArea.X + [COLOR=#0000ff]" "[/COLOR] + zoomArea.Y+ [COLOR=#0000ff]" "[/COLOR] +zoomArea.Width+ [COLOR=#0000ff]" "[/COLOR] +zoomArea.Height;
              [COLOR=#008000]//g.CopyFromScreen(StartX,StartY,0,0, zoomArea.Size);[/COLOR]
            
            g.[COLOR=#191970][B]Dispose[/B][/COLOR]();
            [COLOR=#000080]return[/COLOR] newBmp;
        }

No errors, only confusion for a c# Newbie.

p.s.

Two words that make up c# that aren't Sea or See and Sharp?
 
Last edited:
Back
Top Bottom