3D Twister - Sinus Methods

[Clyde]

Hiya,

Im posting this here, as this I imagine would apply to many different languages and librarys, like C/C+/C++ Ogl and DX, etc, etc.

Ive dug out B3D and been inspired by a few productions that feature twisting effects in. I notice that these are done in 2D. And I would really love to know and very much appreciate is, people ideas and approaches to making a 3D model twist by using Sin And Cos ( or any other math commands like atan, sqr etc ) on the vertecies of the object. The object that I have choosen to try this with, is a segmented cube as it has lots of verticies to play around with rather that just a scaled cube to be a rectangle.

All that I have managed thus far, is to make the object as a standard wave; with nothing to make it change its appearance / motion. Also maybe, I should rotate the verticies independantly in a routine.

Here is some pseudo code, that I'd like people to use to show me how to go about twisting it. It doesnt matter how elaborate it is, zany, its all good. I'd like it to actually twist about, and not a bog standard wave like in a 2D sinus scroller.

Anyhows here's the Psuedo code for use to update the vertex positons.

Code: [Select]

For a=0 To TotalVerts-1
   
   VertX= OriginalVertX( a )
   VertY= OriginalVertY( a )
   VertZ= OriginalVertZ( a )

   VertX+= Some_Kind_Of_Sin_Cos
   VertY+= Some_Sin_Cos
   VertZ+= More_Sin_Cos_Or_Even_Atan_Sqr
   
   Update_Model()
   Update_Normals()

Next

Also, B3D uses Degrees and not Radians, but it doesnt really matter too much.
And maybe I need stuff that goes outside of the loop too.

Many many thanks for your efforts and answering my post, the more methods the better. As I can learn alot from them.

Really very much appreciated and cheers,
Clyde.

[hellfire]

Hehe, when I read "twister" I thought you're talking about such a thing 
[youtube]http://de.youtube.com/watch?v=P54M9X42y1M[/youtube]

let's say your segmented cube is alligned along the y-axis, you just take a rotation-matrix (around the y-axis) and use "y" (plus some offset for animation) as rotation-angle:

Code: [Select]

   c = cos(angle);
   s = sin(angle);

   x'= c*x +  s*z
   y'= y
   z'= -s*x +  c*z
Now just make some interessting variations on "angle".
But there's no need to limit on the "twisting"-part; you can also alter the scaling or the center for each "slice".

[Clyde]

Thanks Hellfire dude,

I thought that my psuedo code would have been able to twist, obviously not the case.

Im a little fuzzy wuzzy on wether or not the object is alligned on its Y-Axis. Is there something that can be done to do this, after the model is created?

Also a bit confused, to what is meant by "taking a rotation-matrix (around the y-axis)"
In Blitz3D, I wouldnt know how to do this. Could you please explain further please dude?

Cheers and huge thanks,
Cyde.

[hellfire]

Well, the main duty of a "rotation matrix around the y-axis" is to rotate a vector around the y-axis
Basically it leaves the y-coordinate where it is and moves x,z a certain amount on a circle (which centered at the origin).
Such a matrix looks like this ("a" being an angle defining how far you want to rotate):

Code: [Select]

cos(a)  0  sin(a)
   0     1    0
-sin(a)  0  cos(a)If you now use your y-coordinate as "a", your objects twists along it's height.
My little example-code above just multiplies a vertex with such a matrix.

wether or not the object is alligned on its Y-Axis.
Is there something that can be done to do this, after the model is created?

What software did you use to create the object?
First of all you have to check whether the "length" of your mesh goes along the y-axis.
You can use any other axis, but you also have to use the corresponding rotation-matrix.
to get your vertices centered around the y-axis, you just look for the minimum/maximum x,z and move your vertices so that minimum+maximum=0.

[Clyde]

I guess my psuedo code isnt of much use, and is wrong. And im a bit stuck on what the loop for twisting should look like.

This is something, I really want to get to work. As im really inspired by other peoples efforts at doing this. And I wonder if other people have any ideas too.

I created the object in a language called Blitz3D, and i've checked that it's central; which it is.

Could you give me some code please dude, including how to check wether the length of the mesh goes along the y-axis, and using it's rotation matrix ( btw it's not a software 2d routine to do 3D, the language im using takes care of the rotation ), also need help with getting the verticies centered around the y-axis w/ looking for the min/max x & z.

If I use the following in the loop I get a sin wave like effect, and not much of a twist.

Code: [Select]


;D2R float = pi/180 ;for converting to degrees.

       VertexX+= Cos( (Angle1+VertexY)*D2R)
     
        VertexY+= (Sin( (Angle1+VertexX)*D2R)*24)+_
                  (Sin( (Angle3+VertexX)*D2R)*32)+_
                  (Sin( (Angle2+VertexX)*D2R)*16)

        VertexZ+= Cos( (Angle3+VertexY)*D2R)*32

Cheers and hugest of thanks,
Clyde.

[hellfire]

I made a little example.
Since I don't know how your object is organized, I created it on-the-fly.
It's basically a a cuboid (without top and bottom face) with a base ranging from -1..+1 and an arbitrary number of segments along the height (y-axis).

First of all we set up the view:

Code: [Select]

   glMatrixMode(GL_PROJECTION);
   glLoadIdentity();
   gluPerspective(45.0, 4.0/3.0, 0.1, 100.0);
   gluLookAt(1,15,2, 0,20,0, 0,1,0);

   glMatrixMode(GL_MODELVIEW);
   glLoadIdentity();

Then we turn on a lightsource so we can see something:

Code: [Select]

   glEnable(GL_LIGHTING);
   GLfloat specular[]= { 1.0f, 1.0f, 1.0f, 1.0f };
   GLfloat ambient[]=  { 0.0f, 0.0f, 0.3f, 1.0f };
   GLfloat diffuse[]=  { 1.0f, 0.9f, 0.9f, 1.0f };
   GLfloat position[]= { 1.5f, 25.0f,30.0f, 1.0f };

   glLightfv(GL_LIGHT0, GL_SPECULAR, specular);
   glLightfv(GL_LIGHT0, GL_AMBIENT, ambient);
   glLightfv(GL_LIGHT0, GL_DIFFUSE, diffuse);
   glLightfv(GL_LIGHT0, GL_POSITION, position);
   glEnable(GL_LIGHT0);

   glMaterialf(GL_FRONT_AND_BACK, GL_SHININESS, 80.0f);
   glShadeModel(GL_SMOOTH);
   glColor4f(1,1,1,1);

Now we create the vertices of our mesh:

Code: [Select]

      // number of segments along the height
      const int seg= 512;
      // vertex buffer: 4 vertices per height-segment
      Vector vtx[seg][4]; // vector is just a structure holding x,y,z (float)

      for (int i=0;i<seg;i++)
      {
         // height normalized to 0..1
         float y= (float)i/seg;

         // rotation angle dependant on vertex' height
         // here you can do whatever you find fitting
         // "time" is a float holding the time passed in seconds
         float angle= sin(y*12.0 - time*0.9)*2.5;
         y*=100.0f; // actual height of the vertex

         // coordinates on a unit circle
         float s= sin(angle);
         float c= cos(angle);

         // since it's a cuboid, the other 3 coordinates are rotated by 90degress,
         // so we can generate those by mirroring
         vtx[i][0].x= s;
         vtx[i][0].y= y;
         vtx[i][0].z= c;

         vtx[i][1].x=-c;
         vtx[i][1].y= y;
         vtx[i][1].z= s;

         vtx[i][2].x=-s;
         vtx[i][2].y= y;
         vtx[i][2].z=-c;

         vtx[i][3].x= c;
         vtx[i][3].y= y;
         vtx[i][3].z=-s;

      }
Now we just have to paint it.
We draw a triangle-strip for each side to preserve shading & edges.

Code: [Select]

      for (int i1=0;i1<4;i1++) // 4 sides
      {
         // vertex on next side
         int i2= (i1+1)&3; // wrap from last (3) to first (0)
         glBegin(GL_TRIANGLE_STRIP);
         for (int j=0;j<seg;j++) // all height-segments
         {
            // the normal is a guesstimate
            glNormal3f( (vtx[j][i1].x+vtx[j][i2].x)*0.7f, 0, (vtx[j][i1].z+vtx[j][i2].z)*0.7f);
            glVertex3f( vtx[j][i1].x, vtx[j][i1].y, vtx[j][i1].z );
            glVertex3f( vtx[j][i2].x, vtx[j][i2].y, vtx[j][i2].z );
         }
         glEnd();
      }

Have fun tweaking it!

[Clyde]

Cheers dude, looks cool, will take a look.

[ edit ]
That is incredible, and thankyou mate.

Only problem I will have, as the language im using is alot different to OGL, and I dont use C. Is in converting over the object, and im using polys and not quads. And as I dont really want to delete the model, somehow im going to have to store everything into arrays and update them accordingly.

This is how my original model looked like ( taken from the Blitzbasic code archives ):

Code: [Select]

Function CreateSegCube(segs=1,parent=0)
mesh=CreateMesh( parent )
For scnt=0 To 3
surf=CreateSurface( mesh )
stx#=-.5
sty#=stx
stp#=Float(1)/Float(segs)
y#=sty
For a=0 To segs
x#=stx
v#=a/Float(segs)
For b=0 To segs
u#=b/Float(segs)
AddVertex(surf,x,y,0.5,u,v)
x=x+stp
Next
y=y+stp
Next
For a=0 To segs-1
For b=0 To segs-1
v0=a*(segs+1)+b:v1=v0+1
v2=(a+1)*(segs+1)+b+1:v3=v2-1
AddTriangle( surf,v0,v1,v2 )
AddTriangle( surf,v0,v2,v3 )
Next
Next
RotateMesh mesh,0,90,0
Next
;top and bottom
RotateMesh mesh,90,0,0
For scnt=0 To 1
surf=CreateSurface( mesh )
stx#=-.5
sty#=stx
stp#=Float(1)/Float(segs)
y#=sty
For a=0 To segs
x#=stx
v#=a/Float(segs)
For b=0 To segs
u#=b/Float(segs)
AddVertex(surf,x,y,0.5,u,v)
x=x+stp
Next
y=y+stp
Next
For a=0 To segs-1
For b=0 To segs-1
v0=a*(segs+1)+b:v1=v0+1
v2=(a+1)*(segs+1)+b+1:v3=v2-1
AddTriangle( surf,v0,v1,v2 )
AddTriangle( surf,v0,v2,v3 )
Next
Next
RotateMesh mesh,180,0,0
Next
UpdateNormals mesh
Return mesh
End Function

Thanks for your further help and patience,
Cheers - Clyde.

[hellfire]

That function produces a cube with every face being a 2d segs*segs grid.
For the twister you just need segmentation along a single axis.
I rearranged my code a bit to fit into that addvertex/triangle-concept (completely untested):

Code: [Select]

      for i = 0 to seg-1
         v= i / seg
         y= v*100.0
         angle= sin(v*12.0 - time*0.9)*2.5

         float x= sin(angle)
         float z= cos(angle)

         AddVertex(surf, x,y,z, 0.0, v)
         AddVertex(surf, -z,y,x, 0.25, v)
         AddVertex(surf, -x,y,-z, 0.5, v)
         AddVertex(surf,  z,y,-x, 0.75, v)
         ' note: if you need proper texture-coordinate, it's necesarry to duplicate the first vertex with u=1.0 here
         ' take the fifth' vertex into account when creating the indices below
      Wend

      for i1= 0 to 3
         i2= (i1+1) and 3
         for int j=0 to seg-2
            AddTriangle( surf, j*4+i1, j*4+i2, (j+1)*4+i1 )
            AddTriangle( surf, j*4+i2, (j+1)*4+i1, (j+1)*4+i2 )
         Wend
     Wend


[Clyde]

Nice one mate, thanks alot for doing that.
There is however one problem, some of the faces look wrong.

[Rbz]

Clyde, it's better if you post your blitz3D code, maybe someone can spot what's wrong with it...

[hellfire]

The orientation of one triangle seems to be wrong (which one depends on whether you cull cw or ccw).
Just try to flip 2nd and 3rd index of one triangle.

[Clyde]

Righty, I am having all kinds of problems with the following Blitz3D test code, main one being I can't get the object to be in view of visable anymore, as ive pigged about with the code for ages changing allsorts. And ive also had ago and made a Center Entity routine. And I havent used Blitz for sometime now, as i've made the switch to Freebasic.

And I dont think that, the method for the sin & cos is quite right for it; especially the time replacement with blitz's milliseconds ( thats bb's time method ) I've done my best to get it as per the examples above ( which I am truely greatful for )

If anyone can shed some light onto the solution, that would be immense & awesome.

Here goes:

Code: [Select]

;
; 3D Twister V1-1
;

Const XRES=640
Const YRES=480

Graphics3D XRES,YRES,32
SetBuffer BackBuffer()

Dim vc( 512*4 )

RunTwist()
End


Function AverageX#( Entity )

Local avgx#

Surface=GetSurface( Entity, 1 )

TotalVerts=CountVertices( Surface )

For a=0 To TotalVerts-1

avgx#=avgx#+VertexX ( Surface, a )

Next

Return ( avgx# / a )

End Function




Function AverageY#( Entity )

Local avgy#

Surface=GetSurface( Entity, 1 )

TotalVerts=CountVertices( Surface )

For a=0 To TotalVerts-1

avgy#=avgy#+VertexY ( Surface, a )

Next

Return ( avgy# / a )

End Function



Function AverageZ#( Entity )

Local avgz#

surface=GetSurface( Entity, 1 )

TotalVerts=CountVertices(Surface)

For a=0 To TotalVerts-1

avgz#=avgz#+VertexZ ( Surface, a )

Next

Return ( avgz# / a )

End Function



Function RunTwist()

MainCam=CreateCamera()

PositionEntity MainCam,0,0,-5

Light=CreateLight()

While Not KeyHit(1)

Twister=CreateCuboidTwister()
PositionEntity Twister,0,0,10
EntityColor Twister,255,000,000
ScaleEntity Twister,50,50,50
CenterMesh( Twister )


RenderWorld()

FreeEntity Twister
Flip

Wend


End Function


Function CenterMesh( Entity )

Local x#=AverageX#( Entity )
Local y#=AverageY#( Entity )
Local z#=AverageZ#( Entity )

surface=GetSurface( Entity,1 )


For a=0 To CountVertices( Surface )-1

vx#=VertexX( surface, a )
vy#=VertexY( surface, a )
vz#=VertexZ( surface, a )

vx#=vx#-x#
vy#=vy#-y#
vz#=vz#-z#

VertexCoords Surface, a, vx#, vy#, vz#

Next

UpdateNormals ( Entity )


End Function




Function CreateCuboidTwister( segs=512, Parent=0 )

Entity = CreateMesh ( Parent )
surface = CreateSurface ( Entity )


For i = 0 To segs-1

v#= i / segs
y#= v*100.0
angle#= Sin(v#*12.0 - MilliSecs()*0.9)*2.5

x#= Sin(angle#)
z#= Cos(angle#)

vc(a)=AddVertex(surface,  x#,y#, z#, 0.0 , v#) : a=a+1
vc(a)=AddVertex(surface, -z#,y#, x#, 0.25, v#) : a=a+1
vc(a)=AddVertex(surface, -x#,y#,-z#, 0.5 , v#) : a=a+1
vc(a)=AddVertex(surface,  z#,y#,-x#, 0.75, v#) : a=a+1

Next

For i1= 0 To 3
i2= (i1+1) And 3
For j=0 To segs-2

v0=j*4+i1
            v1=j*4+i2
            v2=(j+1)*4+i1
            v3=(j+1)*4+i2


AddTriangle( surface, vc(V0), vc(V1), vc(V2) )
AddTriangle( surface, vc(V1), vc(V3), vc(V2) )

Next
Next

UpdateNormals( Entity )

Return ( Entity )

End Function

Cheers,
Clyde.

[hellfire]

I can only comment your source on a theoretical basis since I have no clue what I need to compile it.
The function "CreateCuboidTwister" creates a mesh that is already center in the x- & z-dimensions (x,z are calculated from a unit-circle).
You don't have to center it again with "CenterMesh". If you still want to do that, you should probably initialize the variables "avgx/y/z#" in "AverageX/Y/Z#" to zero.
Translating an object also doesn't change the normals, so "UpdateNormals" shouldn't be required.
Make sure that "v#= i / segs" actually results in a floating-point value.
In the example-code I used a variable "time" which is a floating-point value holding the passed time in seconds.
So you should use something like MilliSecs()/1000.0. It's important to read the time only once so it doesn't change its' value while processing.

[Clyde]

ok Cheers dude for the tips, ive now made a little update.
I need the updatenormals as the model is being created and then deleted; so a new model is made with the new sin and cos. it's how Blitz 3D works with building models

Code: [Select]

;
; 3D Twister V1-1
;
Const XRES=640
Const YRES=480

Graphics3D XRES,YRES,32
SetBuffer BackBuffer()

Dim vc( 512*4 )

RunTwist()
End


Function RunTwist()

MainCam=CreateCamera()

PositionEntity MainCam,0,0,-5

Light=CreateLight()

While Not KeyHit(1)

Twister=CreateCuboidTwister()
PositionEntity Twister,0,0,10
EntityColor Twister,255,000,000
;ScaleEntity Twister,50,50,50

RenderWorld()
Flip

FreeEntity Twister


Wend


End Function



Function CreateCuboidTwister( segs=512, Parent=0 )

Entity = CreateMesh ( Parent )
surface = CreateSurface ( Entity )

Time#=MilliSecs()/1000.00

For i = 0 To segs-1

v#= Float ( i / segs )
y#= v#*100.0
angle#= Sin(v#*12.0 - Time#*0.9)*2.5

x#= Sin(angle#)
z#= Cos(angle#)

vc(a)=AddVertex(surface,  x#,y#, z#, 0.0 , v#) : a=a+1
vc(a)=AddVertex(surface, -z#,y#, x#, 0.25, v#) : a=a+1
vc(a)=AddVertex(surface, -x#,y#,-z#, 0.5 , v#) : a=a+1
vc(a)=AddVertex(surface,  z#,y#,-x#, 0.75, v#) : a=a+1

Next

For i1= 0 To 3
i2= (i1+1) And 3
For j=0 To segs-2

v0=j*4+i1
            v1=j*4+i2
            v2=(j+1)*4+i1
            v3=(j+1)*4+i2

AddTriangle( surface, vc(V0), vc(V1), vc(V2) )
AddTriangle( surface, vc(V1), vc(V3), vc(V2) )

Next
Next

UpdateNormals( Entity )

Return ( Entity )

End Function

I dont know wether or not the source i've posted will fit into the blitz 3d demo as theres a limit to the size of code you can do with the demo trial, but here is a link to the demo version: http://www.blitzbasic.com/file/get.php?file=/Products/demos/Blitz3DDemo183.exe

Cheers and many thanks,
Clyde.

[hellfire]

You now cast the result of an intger-division (result: 0) to floating-point. Instead you need to cast the arguments:

Code: [Select]

v#= Float ( i ) / Float ( segs )
Blitz3D assumes arguments to sin/cos in degree instead of radians:

Code: [Select]

RAD2DEG= 180.0 / 3.1415926535897932384626433832795
angle#= Sin( (v#*12.0 - Time#*0.9) * RAD2DEG )*2.5
x#= Sin(angle# * RAD2DEG)
z#= Cos(angle# * RAD2DEG)
The mesh extends from 0..100 on the y-axis, so the socket is now in the center of the screen.
Just move it down a bit:

Code: [Select]

PositionEntity Twister,0,-50,10
The triangles have wrong orientation (you are looking into the object), just flip the the indices:

Code: [Select]

AddTriangle( surface, vc(V0), vc(V2), vc(V1) )
AddTriangle( surface, vc(V1), vc(V2), vc(V3) )

[Clyde]

Cheers for sorting that for me dude. Nice one.
It doesnt quite twist as your ogl example; will have a bit of a play, unless you know how to correct it.

Big thanks,
Clyde.

[Rbz]

It does Clyde, it's just a matter of point of view

Code: [Select]

;
; 3D Twister V1-1
;
Const XRES=640
Const YRES=480

Graphics3D XRES,YRES,32,2
SetBuffer BackBuffer()

Global pitch#=44.0,yaw#=0,roll#=0

Dim vc( 512*4 )

RunTwist()
End


Function RunTwist()

MainCam=CreateCamera()
CameraClsColor MainCam, 26, 26, 26
CameraClsMode MainCam, True, True
PositionEntity MainCam,0,0,-10

Light=CreateLight(1)
LightColor Light,255.0,255.0,255.0
AmbientLight 50.0,50.0,50.0


While Not KeyHit(1)

Twister=CreateCuboidTwister()
PositionEntity Twister,0,-45,-50
;EntityColor Twister,0,0,76
TurnEntity Twister,pitch#,yaw#,roll#
;ScaleEntity Twister,50,50,50

RenderWorld()

;draw debug info
Text 0,0, "pitch = " + pitch#
Text 0,10, "yaw= " + yaw#
Text 0,20, "roll= " + roll#
;update values
If KeyDown( 208 )=True Then pitch#=pitch#-1.0
If KeyDown( 200 )=True Then pitch#=pitch#+1.0
If KeyDown( 203 )=True Then yaw#=yaw#-1.0
If KeyDown( 205 )=True Then yaw#=yaw#+1.0
If KeyDown( 45 )=True Then roll#=roll#-1.0
If KeyDown( 44 )=True Then roll#=roll#+1.0

Flip

FreeEntity Twister

Wend


End Function



Function CreateCuboidTwister( segs=512, Parent=0 )

Entity = CreateMesh ( Parent )
surface = CreateSurface ( Entity )

Time#=Float(MilliSecs())/1000.00

RAD2DEG= 180.0 / 3.1415926535897932384626433832795

For i = 0 To segs-1

angle#= Sin( (v#*12.0 - Time#*0.9) * RAD2DEG )*2.5
x#= Sin(angle# * RAD2DEG)
z#= Cos(angle# * RAD2DEG)

v#= Float ( i ) / Float ( segs )
y#= v#*100.0

vc(a)=AddVertex(surface,  x#,y#, z#, 0.0 , v#) : a=a+1
vc(a)=AddVertex(surface, -z#,y#, x#, 0.25, v#) : a=a+1
vc(a)=AddVertex(surface, -x#,y#,-z#, 0.5 , v#) : a=a+1
vc(a)=AddVertex(surface,  z#,y#,-x#, 0.75, v#) : a=a+1

Next

For i1= 0 To 3
i2= (i1+1) And 3
For j=0 To segs-2

v0=j*4+i1
            v1=j*4+i2
            v2=(j+1)*4+i1
            v3=(j+1)*4+i2

AddTriangle( surface, vc(V0), vc(V2), vc(V1) )
AddTriangle( surface, vc(V1), vc(V2), vc(V3) )

Next
Next

UpdateNormals( Entity )

Return ( Entity )

End Function

[Clyde]

Mighty thanks for that.

[Clyde]

Ok I've got a few more questions to this.

1/ There is a ripple / bumpy like effect on the u and v co-ordinates of the object. How would this be smoothed out. It's very noticeable once a texture is applied.

2/ How would it be possible to add more bendyness to it? If you need an example of what I mean, I can draw up some example images if that helps.

3/ Sometimes, it jumps with the updating of the current twist calc. I think it's to do with the the timer. Any Ideas on curing that please?

4/ Do you have any more methods / examples of different sin and cos to do to the object?

Cheers and many thanks,
Clyde.

[hellfire]

You should really try to figure out what your code does

angle#= Sin( (v#*12.0 - Time#*0.9) * RAD2DEG )*2.5

Bigger values bend "further"

angle#= Sin( (v#*12.0 - Time#*0.9) * RAD2DEG )*2.5

..."faster"

angle#= Sin( (v#*12.0 - Time#*0.9) * RAD2DEG )*2.5

..."tighter"

There is a ripple / bumpy like effect on the u and v co-ordinates of the object

Sometimes a picture says more than 1000 words.