3D Circular Ring

[icio]

In this experiment I wanted to work out the best method for finding the depth at which to move movieclips to as they rotate.

I did it on the second attempt, too, after starting from scratch. Here is the result:

The code in action (http://img84.imageshack.us/my.php?image=3dcirclegg4.swf&width=480)


var x:Number = 275;
var y:Number = 200;

var h:Number = 0;
var w:Number = 300;

var c:Array = [];
var cCount:Number = 1;

var theta:Number = 0;

function init() {
for (var i:Number =0; i < cCount; i++) {
var circle:MovieClip = _root.attachMovie("circle", "circle_"+i, i, {
_x: x + w/2*Math.sin(Math.PI*2*i/cCount),
_y: y + h/2*Math.cos(Math.PI*2*i/cCount)
});
c.push(circle);

var col:Color = new Color(circle);
var o = {
r: 255*(2*Math.abs(i-cCount/2)/cCount),
g: 100+155*(2*Math.abs(i-cCount/2)/cCount),
b: 100
};
col.setRGB((o.r<<16)+(o.g<<8)+o.b);
}
}

function onEnterFrame() {
theta += 0.02 *Math.PI*(_root._xmouse-Stage.width/2)/Stage.width;
theta = (theta-Math.PI)%(2*Math.PI)+Math.PI;
theta = (theta+Math.PI)%(2*Math.PI)-Math.PI;

h = (_root._ymouse - Stage.height/2)*0.4;

for (var i in c) {
var circle = c[i];

var t:Number = Math.PI*2*i/cCount + theta;
t = (t-Math.PI)%(2*Math.PI)+Math.PI;
t = (t+Math.PI)%(2*Math.PI)-Math.PI;

circle._x = x+w/2*Math.sin(t);
circle._y = y+h/2*Math.cos(t);

circle._xscale = circle._yscale = 70+30*Math.cos(t);
circle._xscale *= Math.cos(t);

t = 1 - Math.abs(t)/Math.PI;
circle.swapDepths(Math.round(t*2*cCount));
}
}

Mouse.addListener(this);
this.onMouseWheel = function(d) {
while (c.length > 0) c.pop().removeMovieClip();
cCount = Math.max(cCount+d, 1);
init();
}
Key.addListener(this);
this.onKeyDown = function() {
if (Key.getCode() == Key.UP)
this.onMouseWheel(1);
else if (Key.getCode() == Key.DOWN)
this.onMouseWheel(-1);
}

init();

[kdd]

Man, you always come up with cool stuff! :thumb:

[BlackShadow]

very cool effect!
i LOVE it

and i agree, you do some very sweet experiments! :beer:

[icio]

Thanks for the comments, guys. They always mean a lot to me :)

[hybrid101]

that is one sweet experiment mate;)
i made a rectangle:D

[kirupa]

Really cool stuff :te:

[icio]

Hey, thanks :D

I'm looking into skewing the objects too so that it still look sok if you use larger, square movieclips. Will update with more info.

But for now, Revision!

[Voetsjoeba]

Nice one paul :)

[ChromeDemon]

Tip Top ... Nice Stuff indeed

[Soulberry]

Beautiful!..aesthetic too.

[jeancnicolas]

Ok - BUT can you have each 'node' as an indiviual button - AND with a different shape/OR/graphic .... ?

then the possibillities are unrivaled!

Very neat code btw!

[icio]

BUT can you have each 'node' as an indiviual buttonYes, with a slight modification of the code.


with a different shape/OR/graphic .... ?Yes, with a slight modification of the code.

But both of those points were outwith the scope of the experiment. Also, if you were going to use a different graphic you would need to skew the graphics too.

:thumb:

[phorte]

very neat! lots of potential there.