Zooming a picture in a picture box

[Peekay]

I have a picture in picture box named Picture1. This picture uses scalemode=user.

I now need to copy this picture from Picture1 to Picture2, but it must be zoomed in Picture2 in the sense that the two pictures keep their .height and .width properties, but the scales must change - it must be enlarged or reduced.

I cannot have the second picture as an image control, as I draw and write onto it after I have zoomed the original picture.

Let us say I wish to zoom in 50%.
When I click on user point coordinates X and Y in the original picture, it must take this X and Y as the new centre of my zoomed picture and half the scalewidth and scaleheight dimensions to show only a quarter of the original picture as a clipped picture or image.

Sorry for the tall order.

Thanks
PK

[Argus19]

There is a "paintpicture" method. It can copy to the desired location starting from the selected location and the selected size. There is no need to use the functions of the GDI library.

[Peekay]

Argus19,

I know of the method, but there are so many variables to this.
The big problem is that I can enlarge and reduce, but when I draw on the enlarged or reduced picture, the coordinates are not consistent with the original picture anymore.

Here is my routine:

Private Sub Picture1_MouseUp(Button As Integer, Shift As Integer, x As Single, y As Single)

If Button = 1 Then
    ZoomFactor = ZoomFactor * 1.2        'left click - enlarge
Else
    ZoomFactor = ZoomFactor * 0.8       'right click - reduce
End If

Picture1.ScaleWidth = ZoomFactor * picGoogle.ScaleWidth
Picture1.ScaleHeight = ZoomFactor * picGoogle.ScaleHeight
Picture1.ScaleLeft = x - Picture1.ScaleWidth / 2
Picture1.ScaleTop = y - Picture1.ScaleHeight / 2
Set Picture1.Picture = Nothing

Picture1.PaintPicture picGoogle.Picture, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth, Picture1.ScaleHeight, picGoogle.ScaleLeft, picGoogle.ScaleTop, picGoogle.ScaleWidth, picGoogle.ScaleHeight
Picture1.Scale (x - Picture1.ScaleWidth / 2, y - Picture1.ScaleHeight / 2)-(x - Picture1.ScaleWidth / 2 + Picture1.ScaleWidth, y - Picture1.ScaleHeight / 2 + Picture1.ScaleHeight)
DrawPipesXYZ Picture1, "XY"
DrawXYZNodes Picture1, "XY", False

End Sub

I am using lat and long in my google picture which I set with picGoogle.scale
The thing now is to rescale Picture1 to the new lat and long of the enlarged or reduced picture, which I am not getting right with the above routine.

PK

[passel]

First off, it seems like you got your scale factors reversed.
You're multiplying by 1.2 to "Enlarge", but if you multiply a scale, so you have more scale, that means you have more picture in the same area, so the picture has to be smaller..

If I'm currently looking at 1 degree of height and I want to zoom in so I'm looking at 1/4 of the area, then the scale should change from 1 degree of height to 1/2 degree of height.
The scale gets smaller to zoom in, and larger to zoom out.
But that is somewhat of a technicality. Even if your terminology is reversed, the resulting scale should still be consistent with the source if done correctly and you should be able to draw on either map with the same coordinates.

I didn't test it, but it should be fairly simple.
If your picGoogle scalemode is User and the scale is set to the proper decimal degrees of the area that is shown, then you should be able to calculate the area of the picGoogle image you want in degrees (assuming you're using units of degrees for your scale).

You would set the scale of the destination picturebox to match that area, and then paintPicture from the source using that same area for both the source and the destination, i.e. I want to copy 1/2 a degree of height from the source picture to 1/2 a degree of height in the destination picture. That should fill the destination picture since you set the scale to match the area.

It looks like you have your paint picture correct, which means your scale should be correct at that point. There is no need to then modify the picture1's scale again as it should already match what you just painted which should match the area of the picGoogle that you painted from.
Perhaps you just need to delete that line after the PaintPicture statement and it will work.

Of course when you're zooming out, if you exceed the bounds of the picGoogle source, then you should end up with an empty border around the map in the destination, I think, as you're painting from areas outside the source picturebox.

[Argus19]

I have a picture in picture box named Picture1. This picture uses scalemode=user.

I now need to copy this picture from Picture1 to Picture2, but it must be zoomed in Picture2 in the sense that the two pictures keep their .height and .width properties, but the scales must change - it must be enlarged or reduced.

Here:

Picture1.PaintPicture picGoogle.Picture, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth, Picture1.ScaleHeight, picGoogle.ScaleLeft, picGoogle.ScaleTop, picGoogle.ScaleWidth, picGoogle.ScaleHeight
Picture1.Scale (x - Picture1.ScaleWidth / 2, y - Picture1.ScaleHeight / 2)-(x - Picture1.ScaleWidth / 2 + Picture1.ScaleWidth, y - Picture1.ScaleHeight / 2 + Picture1.ScaleHeight)

picGoogle.Picture copied to Picture1.
The coordinates of the mouse on Picture1. And there is nothing there yet. Or am I misunderstanding the idea described in the first post?

[Peekay]

passel,
Thanks for your detailed comment. As always it is appreciated.

Argus19,
Thanks, your line works well, but I still have to work on it.
The first thing I must do is to always zoom with the centre of picGoogle to stay centrally.
To do that, I will need a pan option in four directions. Could you help me with that please.

PK

[Argus19]

The first thing I must do is to always zoom with the centre of picGoogle to stay centrally.

I wrote similar. Perhaps these codes will help you:
https://yadi.sk/d/JX1m8ftLhPptZA
https://yadi.sk/d/nygcXf4TnX5VqA

[Peekay]

My code does zoom the picture, but does not place the part of the picture extracted from the original picturebox on the left side of the destination picture box, and I do not know why.
Here is my latest code:

Private Sub Picture1_MouseUp(Button As Integer, Shift As Integer, x As Single, y As Single)
Dim NewXleft As Single, NewYtop As Single, NewXright As Single, NewYbottom As Single, NewWidth As Single, NewHeight As Single

If Button = 1 Then
    ZoomFactor = ZoomFactor * 0.5      'left click - zoom in
Else
    ZoomFactor = ZoomFactor * 2  'right click - zoom out
End If

NewWidth = ZoomFactor * picGoogle.ScaleWidth
NewHeight = ZoomFactor * picGoogle.ScaleHeight
NewXleft = x - NewWidth / 2
NewYtop = y - NewHeight / 2
Set Picture1.Picture = Nothing
Picture1.Scale (NewXleft, NewYtop)-(NewXleft + NewWidth, NewYtop + NewHeight)
Picture1.PaintPicture picGoogle.Picture, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth, Picture1.ScaleHeight, picGoogle.ScaleLeft, picGoogle.ScaleTop, picGoogle.ScaleWidth, picGoogle.ScaleHeight

DrawPipesXYZ Picture1, "XY"
DrawXYZNodes Picture1, "XY", False

End Sub

PK

[Argus19]

Perhaps I misunderstood the translation, so I wrote a simple map viewer. The map is scrolled using two scroll bars. When you click on the left image, the selected area will appear in the right picture box.
https://yadi.sk/d/AlAHuY03B2cVTw

[Peekay]

Argus19,

That is excellent thanks. Just what I need.

PK

[Argus19]

Just what I need.

Glad I could help.
I wasn't sure if the google translator was translating correctly.
In the two previous examples, the image is scrolled with the mouse wheel. The center of the image is taken as a base.
They use the functions of the GDI+ libraries.

[Peekay]

The routines by Argus19 did not satisfy my needs , as I thought it would at first. It is quite a good project for other purposes.

So, for me it is back to the drawing board.

I have this routine which scales my drawing onto the picture perfectly, but it does not scale the picture itself. What am I doing wrong?

Private Sub Picture1_MouseUp(Button As Integer, Shift As Integer, x As Single, y As Single)
Dim NewXScaleLeft As Single, NewYScaleTop As Single, NewXScaleRight As Single, NewYScalebottom As Single, NewScaleWidth As Single, NewScaleHeight As Single, NewHeight As Single, NewWidth As Single

If Button = 1 Then
    ZoomFactor = ZoomFactor * 1.2      'left click - zoom out
Else
    ZoomFactor = ZoomFactor * 0.8  'right click - zoom in
End If

Picture1.Scale (picGoogle.ScaleLeft, picGoogle.ScaleTop)-(picGoogle.ScaleLeft + picGoogle.ScaleWidth * ZoomFactor, picGoogle.ScaleTop + picGoogle.ScaleHeight * ZoomFactor)
Picture1.PaintPicture picGoogle.Picture, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth / 2, Picture1.ScaleHeight / 2, picGoogle.ScaleLeft, picGoogle.ScaleTop, picGoogle.ScaleWidth, picGoogle.ScaleHeight
Picture1.Cls
DrawPipesXYZ Picture1, "XY"
DrawXYZNodes Picture1, "XY", False

End Sub

Thanks
PK

[passel]

p.s. I decided to try to test the below statement, and it doesn't seem to work as I thought it should, so I guess you can ignore me for now. The problem is that PaintPicture uses scalemode of picture1 for both the source and destination areas, it doesn't use the source's scalemode for its area, so it ends up treating the source (picGoogle) as if it had the same scaling as Picture1, so my code below just ends up copying the whole area of picGoogle because it is copying to the whole area of Picture1.

{ignore post after this point} As I said in post #4, I think if you've scaled Picture1 correctly, it represents a subsection of picGoogle image, so you would copy that subsection from the picGoogle image to the Picture1 image, i.e. the coordinates and widths defined the same area in both pictures so you would use the same values for the source area and the destination area, that is the coordinates and width you defined for Picture1's scale.

Picture1.PaintPicture picGoogle.Picture, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth, Picture1.ScaleHeight, Picture1.ScaleLeft, Picture1.ScaleTop, Picture1.ScaleWidth, Picture1.ScaleHeight

But, I'm not sure that you set the Scale's Left and Top correctly. You're setting them to picGoogle's ScaleLeft and Scaletop, when you really want a values based on a center coordinate, so perhaps the centering values you tried to use in the PaintPicture should be applied to your Scale statement for Picture1.

[Peekay]

passel,

I had the scaling of the picture working a day ago with these selfsame parameters, but for one or other reason it stopped working. I presume it might be something to do with autosize or some other picture property.
I see some programmers put the first picture in an image control in between the steps and then abstract the image from there to the destination picture control, but I do not know what good is that.
I am using the same scaleleft and scaletop numbers as the picGoogle picture in order to keep my clipped picture always on the left of picture1. That way it is easier for me to get the coordinates of picture1 right.

OK, I have found the problem now. I have to erase the Picture1 picture and then put the image of picGoogle in it. I also used Picture1.cls to clear my graphics from an earlier paint which erased the modified picture. Progressing now. Thanks.

PK

[Argus19]

but it does not scale the picture itself. What am I doing wrong?

Do you not only need to copy the picture from picGoogle.Picture to Picture1, but also resize the picture in picGoogle.Picture?

[passel]

passel,
...
OK, I have found the problem now. I have to erase the Picture1 picture and then put the image of picGoogle in it. I also used Picture1.cls to clear my graphics from an earlier paint which erased the modified picture. Progressing now. Thanks.

PK

But you also wanted to zoom and center the image from picGoogle.
Basically, after playing around a bit, I think what you want to do is load a picture in picGoogle, and have AutoRedraw set, so the visible part of the image (what you see) is copied from the .Picture context to the .Image context. You will PaintPicture from picGoogle.Image instead of .Picture

I think the steps are then.
1. Set Picture1.ScaleLeft, ScaleTop, ScaleWidth and ScaleHeight to match picGoogle's scale.
2. Determine the area of picGoogle that you want to fill Picture1 with, based on your scaling and centering. Lets designate that area as (X1, Y1) - (X2 - Y2) and also srcWidth, srcHeight (srcWidth being essentially X2 - X1, and srcHeight being Y2 - Y1)

3. Paint the subarea from picGoogle to the full area of Picture1.
4. Then set Picture1's scale to match the area selected

  With Picture1
    Picture1.PaintPicture picGoogle.Image, .ScaleLeft, .ScaleTop, .ScaleWidth, .ScaleHeight, X1, Y1, srcWidth, srcHeight
    Picture1.Scale (X1, Y1)-(X2, Y2)
  End With

I did a quick test where I picked the (X1,Y1)-(X2,Y2) values by clicking and dragging a rectangle on picGoogle (X1,Y1 set on mouse down, X2, Y2 set on mouse up).
This drew the area expanded in Picture1.
I could then drag on Picture1 and using the X,Y values from that picturebox, draw a line along those X,Y coordinates on picGoogle and see that it was drawing at the same spot from the zoomed image, back to the picGoogle image.

When I selected another area on picGoogle (on mouseDown, I did a cls which cleard the scribbles).

[Peekay]

passel,

I think you are right. I will try that process.

Thanks a lot

PK

[Peekay]

Thank you passel and Argus19.

I am there, except for a few fine tuning items. I appreciate your help and support through this tribulation in which I learned a lot.

PK