Dots connected with lines "wiggling"

[DG13]

Good evening,

 

I'm trying to achieve an effect where several "dots" are interconnected with 3px lines, I want the "dots" to have some random wiggle to them, and have the lines always connected form one center to the next dots.

 

anyone have experience with this, that could point me towards the right direction?

 

Thanks!

[Carl]

Here is a very basic implementation that should illustrate the core concepts:

 

 

 

import com.greensock.*;
import flash.events.Event;

//record the starting positions of each clip so that they never wiggle too far away from their origin

mc1.startX = mc1.x;
mc1.startY = mc1.y;
mc2.startX = mc2.x;
mc2.startY = mc2.y;


//create a tween that recursively calls this function and repeatedly tweens the same element
function wiggle(mc) {
    TweenLite.to(mc, .5, {x:mc.startX + randomNumber(-20, 20), y:mc.startY + randomNumber(-20, 20), onComplete:wiggle, onCompleteParams:[mc]});
}


function randomNumber(min:Number, max:Number):Number {
    return Math.floor(Math.random() * (1 + max - min) + min);
}


addEventListener(Event.ENTER_FRAME, drawLine);


function drawLine(e:Event):void {
    this.graphics.clear();
    graphics.lineStyle(3,0x000000);
    this.graphics.moveTo(mc1.x, mc1.y);
    this.graphics.lineTo(mc2.x, mc2.y);
    }

//wiggle both mcs

wiggle(mc1);
wiggle(mc2);
 

 

CS5 fla attached

 

wiggleLines.zip