Recursive Hexagaon

[jeancnicolas]

Hello, I've been having a go with a recursive animation, where my hexagons shrink and spawn their relatively scaled offspring, which repeat this action.

There's a nice snowflake pattern emerging, and I wish to make it interactive, activating a 'shrink and spawn' with roll over.

Anyhow -> to the code .. It works to an extent. You will certainly see the effect Im trying to achieve... its good - but gets out of hand, and i dont know why! it seems to start getting bigger and bigger - but each recursion is meant to get smaller, like the first couple of instances do...

Is there any hands to help!? download the source

ps source is using Tweenmax to cause the animation, and make use of a callback.

for a quick look online ::: go here

[jeancnicolas]

cor blimey you lot - is this not interesting to someone!?

[IQAndreas]

I can't open FLAs in Linux.

Could you paste only the code from it into a new post?

[jeancnicolas]

sure .. however - I am loading in a shape from the library inside the fla. And using a tween library to animate.
Effectively (in the library) it's a shape class which has 6 other smaller hexagons inside, each with an instance name of 'aa'+i .. these are called in the loop to animate to their new positions based on scale and radius of their parent.

Anyway - its more about getting the loops right and passing data from parent to spawn. So here it is

import com.greensock.TweenMax;import com.greensock.easing.*;
import flash.display.MovieClip;


var master = [];
master[0] = [];
var temp_ary = [];
var count:uint = 0;
var total:uint = 0;
var end:Boolean = false;
var boxes = [];


var diameter = 100; // default start width
var range = diameter *.73;
var percent:Number = 0.5;
var angle = Math.PI*2/6;
var deg90:Number = Math.PI/2;


var q:Quad = new Quad();
boxes[0] = addChild(q);
q.x = 150; q.y = 150;q.alpha=0.7;
var strt = { me:boxes[0], xpos:q.x, ypos:q.y, index:0, diam:range,percent:percent};
animate(strt);


function animate(obj:Object):void{
    for(var i:uint=0;i<6;i++){
        total++;
        var container:MovieClip = obj.me;
        var kid:MovieClip = container["aa"+i];
        var tx:Number = obj.diam * Math.cos(angle+(angle*i)-deg90); 
        var ty:Number = obj.diam * Math.sin(angle+(angle*i)-deg90);
        var ob = {
                me:        container,
                xpos:    tx,
                ypos:    ty,
                diam:    obj.diam,
                percent:obj.percent
        };
        var tw:TweenMax = new TweenMax(kid, 2, {x: tx,y:ty,scaleX:obj.diam/100, scaleY:obj.diam/100, alpha:0.1, ease:Expo.easeOut,delay:1,onComplete:spawn, onCompleteParams:[ob]});
    }
}


function spawn(obj:Object){
    total++;
    var b:Quad = new Quad();
    boxes[total] = addChild(b); b.alpha=0.7;
    boxes[total].x = obj.me.x + obj.xpos;
    boxes[total].y = obj.me.y + obj.ypos;
    
    var scale:Number = (obj.diam*obj.percent)/100;
    boxes[total].scaleX = scale;
    boxes[total].scaleY = scale;


    var newRange:Number = 100-(obj.diam*obj.percent); // use for radius
    
    var ob = { 
        me:        boxes[total], 
        xpos:    boxes[total].x, 
        ypos:    boxes[total].y, 
        diam:    newRange,
        percent:obj.percent * .666
    };
    if(total < 500){
        animate(ob);
    };
}