simple image warping ?

-=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- (c) WidthPadding Industries 1987 0\|53\|0 -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=- -=+=-
Socoder -> Blitz -> simple image warping ?
Tue, 17 Jun 2008, 02:50
spinal	I asked a couple of you guys in mud the other day, but none of us got anywhere, so maybe some others can help. Im trying to load an image by hand (on the ds) and plot it pixel by pixel onto the screen, but I want to warp it a little to look as if it's at an angle. But I cant figure out the maths behind it. I know some of you may suggest just using a 3d object or something, but im not going to do it that way, it must be done by pixeling the screen. If you look at the following blitz code, it will load an image (to copy from, pretend its an array of pixels or even reading the bmp file directly) I want the first shape (the one being plotted) to look like the second one (the wire frame), but it needs to be done by hand, so setting the y pixel location depending on the x or something. Can anyone help? Graphics 640,480,0,2 picture = LoadImage("cover.bmp") DrawBlock picture, 0,120 For x=0 To 127 For y=0 To 115 GetColor x,y+120 Plot x,y Next Next Color 255,255,255 Line 140,0,255,20 Line 140,115,255,115 Line 140,0,140,115 Line 255,20,255,115 WaitKey() End --v -=-=- Check out my excellent homepage!
Tue, 17 Jun 2008, 03:43
Jayenkai	Graphics 640,480,0,2 SetBuffer BackBuffer() ; DrawImageWarped Image , ; TopLeftX, TopLeftY ; TopRightX, TopRightY ; BottomRightX, BottomRightY ; BottomLeftX, BottomRightY picture = CreateImage(128,115) SetBuffer ImageBuffer(picture) For x=0 To 128 For y=0 To 115 Color Rand(0,8)8,Rand(0,8)8,Rand(0,8)8 Plot x,y Next Next Color 255,0,0 Text 0,0,"This is an image" Color 0,255,0 Text 0,50,"This is an image" Color 0,0,255 Text 0,100,"This is an image" SetBuffer BackBuffer() Repeat Cls DrawImageWarped picture, 0,0, MouseX(),0+(MouseY()/8) , MouseX()-(MouseX()/4),MouseY()-(MouseY()/6) ,0+MouseX()/8,MouseY() Flip Until KeyDown(1) Function DrawImageWarped(img,x1#,y1#,x2#,y2#,x3#,y3#,x4#,y4#) fx#=x1 fy#=y1 x4=x4-fx y4=y4-fy x3=x3-fx y3=y3-fy x2=x2-fx y2=y2-fy x1=x1-fx y1=y1-fy nx#=0 ny#=0 LockBuffer ImageBuffer(img) LockBuffer BackBuffer() For x#=0 To ImageWidth(img)-1 For y#=0 To ImageHeight(img)-1 argb=ReadPixelFast(x,y,ImageBuffer(img)) nx=((x2-x1)/ImageWidth(img))x nx=nx+(((x4-x1)/ImageHeight(img))y) nx=nx+(((((x3-x4)-(x2-x1))/ImageHeight(img))y)/ImageWidth(img))x ny=((y2-y1)/ImageWidth(img))x ny=ny+(((y4-y1)/ImageHeight(img))y) ny=ny+(((((y3-y4)-(y2-y1))/ImageHeight(img))y)/ImageWidth(img))*x WritePixelFast nx+fx,ny+fy,argb,BackBuffer() Next Next UnlockBuffer ImageBuffer(img) UnlockBuffer BackBuffer() End Function --v Far from perfect, probably too slow, not smoothly scaled... But does the job.. -=-=- ''Load, Next List!''
Tue, 17 Jun 2008, 04:23
Jayenkai	hehe, it's fun to play with Graphics 640,480,0,2 SetBuffer BackBuffer() ; DrawImageWarped Image , ; TopLeftX, TopLeftY ; TopRightX, TopRightY ; BottomRightX, BottomRightY ; BottomLeftX, BottomRightY picture = CreateImage(128,115) SetBuffer ImageBuffer(picture) For x=0 To 128 For y=0 To 115 Color Rand(0,8)8,Rand(0,8)8,Rand(0,8)8 Plot x,y Next Next Color 255,0,0 Text 0,0,"This is an image" Color 0,255,0 Text 0,50,"This is an image" Color 0,0,255 Text 0,100,"This is an image" SetBuffer BackBuffer() Dim coord(4,2) coord(1,1)=100 coord(1,2)=100 coord(2,1)=228 coord(2,2)=100 coord(3,1)=228 coord(3,2)=215 coord(4,1)=100 coord(4,2)=215 Repeat Cls Color 255,255,255 Line coord(1,1),coord(1,2) , coord(2,1),coord(2,2) Line coord(2,1),coord(2,2) , coord(3,1),coord(3,2) Line coord(3,1),coord(3,2) , coord(4,1),coord(4,2) Line coord(4,1),coord(4,2) , coord(1,1),coord(1,2) For n=1 To 4 If Abs(MouseX()-coord(n,1))<8 And Abs(MouseY()-coord(n,2))<8 And MouseDown(1) And catch=0 Then catch=n If catch=n Then coord(n,1)=MouseX():coord(n,2)=MouseY() Next If MouseDown(1)=0 Then catch=0 DrawImageWarped picture, coord(1,1),coord(1,2) , coord(2,1),coord(2,2) , coord(3,1),coord(3,2) , coord(4,1),coord(4,2) Flip Until KeyDown(1) Function DrawImageWarped(img,x1#,y1#,x2#,y2#,x3#,y3#,x4#,y4#) fx#=x1 fy#=y1 x4=x4-fx y4=y4-fy x3=x3-fx y3=y3-fy x2=x2-fx y2=y2-fy x1=x1-fx y1=y1-fy nx#=0 ny#=0 LockBuffer ImageBuffer(img) LockBuffer BackBuffer() For x#=0 To ImageWidth(img)-1 For y#=0 To ImageHeight(img)-1 argb=ReadPixelFast(x,y,ImageBuffer(img)) nx=((x2-x1)/ImageWidth(img))x nx=nx+(((x4-x1)/ImageHeight(img))y) nx=nx+(((((x3-x4)-(x2-x1))/ImageHeight(img))y)/ImageWidth(img))x ny=((y2-y1)/ImageWidth(img))x ny=ny+(((y4-y1)/ImageHeight(img))y) ny=ny+(((((y3-y4)-(y2-y1))/ImageHeight(img))y)/ImageWidth(img))*x WritePixelFast nx+fx,ny+fy,argb,BackBuffer() Next Next UnlockBuffer ImageBuffer(img) UnlockBuffer BackBuffer() End Function --v -=-=- ''Load, Next List!''
Tue, 17 Jun 2008, 07:40
mindstorm8191	I wrote this aspect-image routine which is probably something you're trying to do. It basically let me move 4 points of an image to anywhere I wanted. It was a tough algorithm to write. My first try was in Blitz which didn't go over too smoothly. I did it in C++ for an image library for Allegro and OpenGL. I honestly forget how I went about it, I haven't messed with it in a year or so. I believe I did a full pass on the target image-space, and from the source, I calculated where that would be for the aspect, and if that was in bounds on the image, collect the color values there. If not draw black or nothing. Wish I could help you out some more. If you still need help, let me know and I can dig out my code, but it'll probably be a mess to dig through. -=-=- Vesuvius web game
Wed, 18 Jun 2008, 20:19
Orion Pax	That second one is sweet jay. I dragged all 4 corners around until it was upside down and backwards. That was fun.
Fri, 20 Jun 2008, 18:22
dna	You are good at what you do Jay. If they posted samples like this at the purebasic site they would be something better. -=-=- DNA
Fri, 20 Jun 2008, 18:31
dna	I used this code Graphics 640,480,16,2 SetBuffer BackBuffer() ; DrawImageWarped Image , ; TopLeftX, TopLeftY ; TopRightX, TopRightY ; BottomRightX, BottomRightY ; BottomLeftX, BottomRightY picture = LoadImage("e:/show/S120.jpg"):Goto lop picture = CreateImage(128,115) SetBuffer ImageBuffer(picture) For x=0 To 128 For y=0 To 115 Color Rand(0,8)8,Rand(0,8)8,Rand(0,8)8 Plot x,y Next Next Color 255,0,0 Text 0,0,"This is an image" Color 0,255,0 Text 0,50,"This is an image" Color 0,0,255 Text 0,100,"This is an image" SetBuffer BackBuffer() .lop Repeat Cls DrawImageWarped picture, 0,0, MouseX(),0+(MouseY()/8) , MouseX()-(MouseX()/4),MouseY()-(MouseY()/6) ,0+MouseX()/8,MouseY() Flip Until KeyDown(1) End Function DrawImageWarped(img,x1#,y1#,x2#,y2#,x3#,y3#,x4#,y4#) fx#=x1 fy#=y1 x4=x4-fx y4=y4-fy x3=x3-fx y3=y3-fy x2=x2-fx y2=y2-fy x1=x1-fx y1=y1-fy nx#=0 ny#=0 LockBuffer ImageBuffer(img) LockBuffer BackBuffer() For x#=0 To ImageWidth(img)-1 For y#=0 To ImageHeight(img)-1 argb=ReadPixelFast(x,y,ImageBuffer(img)) nx=((x2-x1)/ImageWidth(img))x nx=nx+(((x4-x1)/ImageHeight(img))y) nx=nx+(((((x3-x4)-(x2-x1))/ImageHeight(img))y)/ImageWidth(img))x ny=((y2-y1)/ImageWidth(img))x ny=ny+(((y4-y1)/ImageHeight(img))y) ny=ny+(((((y3-y4)-(y2-y1))/ImageHeight(img))y)/ImageWidth(img))*x WritePixelFast nx+fx,ny+fy,argb,BackBuffer() Next Next UnlockBuffer ImageBuffer(img) UnlockBuffer BackBuffer() End Function --v and put a 7x10 image into your program but there was some curved artifacts in the image when it drew it. Where does this occur? -=-=- DNA
Sat, 21 Jun 2008, 04:10
Jayenkai	The line... DrawImageWarped picture, 0,0, MouseX(),0+(MouseY()/8) , MouseX()-(MouseX()/4),MouseY()-(MouseY()/6) ,0+MouseX()/8,MouseY() --v Isn't a perfect square, it's skewed, and warped... Change it to a perfect square, and it comes out fine. The warping occurs in that big squiggly maths stuff at the bottom. Basically like so.. nx=((x2-x1)/ImageWidth(img))x ; Take the X distance, and move it between the first two points. nx=nx+(((x4-x1)/ImageHeight(img))y) ; Then add x movement so that it's left aligned with the Y row. nx=nx+(((((x3-x4)-(x2-x1))/ImageHeight(img))y)/ImageWidth(img))x ; Next, move it between the left and right of the current row. --v Nice and simple.. cough Purely trial and error coding, there! -=-=- ''Load, Next List!''
Sun, 22 Jun 2008, 11:46
Andy_A	Here's a version that fills in the "holes", but in doing so creates artifacts at certain angles. Graphics 640,480,0,2 SetBuffer BackBuffer() ; DrawImageWarped Image , ; TopLeftX, TopLeftY ; TopRightX, TopRightY ; BottomRightX, BottomRightY ; BottomLeftX, BottomRightY whichOne% = 0 Select whichOne% Case 0 picture = CreateImage(128,115) SetBuffer ImageBuffer(picture) For x=0 To 128 For y=0 To 115 Color Rand(0,8)8,Rand(0,8)8,Rand(0,8)8 Plot x,y Next Next Color 255,0,0 Text 0,0,"This is an image" Color 0,255,0 Text 0,50,"This is an image" Color 0,0,255 Text 0,100,"This is an image" SetBuffer BackBuffer() Case 1 fileName$ = RequestFile("Load image...","bmp;.png;.jpg",False) If fileName$ <> "" Then picture% = LoadImage(fileName$) Else RuntimeError "Image Not Loaded!" End If End Select imgBank% = CreateBank(ImageWidth(picture)ImageHeight(picture)4) sizeX% = Floor(GraphicsWidth()/ImageWidth(picture)) + 1 sizeY% = Floor(GraphicsWidth()/ImageHeight(picture)) + 1 imgBuff% = ImageBuffer(picture) LockBuffer(imgBuff) k% = 0 For i = 0 To ImageWidth(picture)-1 For j = 0 To ImageHeight(picture)-1 PokeInt(imgBank%, k%, ReadPixelFast(i,j,imgBuff)) k = k + 4 Next Next UnlockBuffer(imgBuff) Dim coord(4,2) coord(1,1)=100 coord(1,2)=100 coord(2,1)=228 coord(2,2)=100 coord(3,1)=228 coord(3,2)=215 coord(4,1)=100 coord(4,2)=215 Repeat Cls Color 255,255,255 Line coord(1,1),coord(1,2) , coord(2,1),coord(2,2) Line coord(2,1),coord(2,2) , coord(3,1),coord(3,2) Line coord(3,1),coord(3,2) , coord(4,1),coord(4,2) Line coord(4,1),coord(4,2) , coord(1,1),coord(1,2) For n=1 To 4 If Abs(MouseX()-coord(n,1))<8 And Abs(MouseY()-coord(n,2))<8 And MouseDown(1) And catch=0 Then catch=n If catch=n Then coord(n,1)=MouseX():coord(n,2)=MouseY() Next If MouseDown(1)=0 Then catch=0 DrawImageWarped picture, coord(1,1),coord(1,2) , coord(2,1),coord(2,2) , coord(3,1),coord(3,2) , coord(4,1),coord(4,2), imgBank, sizeX, sizeY Flip Until KeyDown(1) FreeBank imgBank FreeImage picture End Function DrawImageWarped(img,x1#,y1#,x2#,y2#,x3#,y3#,x4#,y4#,bank%,sx%,sy%) fx#=x1 fy#=y1 x4=x4-fx y4=y4-fy x3=x3-fx y3=y3-fy x2=x2-fx y2=y2-fy x1=x1-fx y1=y1-fy nx#=0 ny#=0 fw# = ImageWidth(img) fh# = ImageHeight(img) k% = -4 For x#=0 To fw-1 For y#=0 To fh-1 k% = k% + 4 nx=((x2-x1)/fw)x nx=nx+(((x4-x1)/fh)y) nx=nx+(((((x3-x4)-(x2-x1))/fh)y)/fh)x ny=((y2-y1)/fw)x ny=ny+(((y4-y1)/fh)y) ny=ny+(((((y3-y4)-(y2-y1))/fh)y)/fw)*x Color PeekByte(bank,k+2),PeekByte(bank,k+1),PeekByte(bank,k) Rect nx+fx,ny+fy,sx,sy,True Next Next End Function --v
Thu, 26 Jun 2008, 17:12
dna	That code does not work for me since I have B2d. The request file command I'll try to change. -=-=- DNA
Fri, 27 Jun 2008, 07:07
Andy_A	Yeah I wrote that using B+ You could just comment out that one line containing request file and it should compile without a hitch.