Problem reading x & y co-ordinates of tweened object on enter frame - AS3

Hi Can someone please explain why the lines drawn between the circles in the code below are not aligned with the centre of the circles?

It seems the x and y properties of the circles are not up to date with their actual positions but how can this be?

import flash.display.Sprite
import fl.transitions.*;
import fl.transitions.easing.*;

var mcs=[];

function go(Y,size,col,opac){
    var mc=new Sprite()
    mc.y=Y
    mc.x=600
    mc.graphics.beginFill(col,opac)
    mc.graphics.drawCircle(0,0,size/3)
    mc.graphics.endFill()
    addChild(mc)
    mcs.push(mc)

    var xPosT = new Tween(mc, "x", Strong.easeOut, 600, 0, 3,true);
}

function upd(e){
    graphics.clear()
    graphics.moveTo(mcs[0].x,mcs[0].y)
    for(var i in mcs){
        graphics.lineStyle(0,0xCCCCCC,1)
        graphics.lineTo(mcs[i].x, mcs[i].y)
    }
}

setInterval(function(){
    go(randomNo(400),randomNo(50,5),0xCCCCCC,1)
},500)

stage.addEventListener(Event.ENTER_FRAME,upd)


//Returns a random number between from and to inclusive
function randomNo(to:Number,from=0,decimalPlaces=0):Number{
    var ret=roundDecimal(Math.random()开发者_StackOverflow*(to-from)+from,decimalPlaces)
    return(ret)
}
function roundDecimal(num:Number, precision:int):Number{
    var decimal:Number = Math.pow(10, precision);
    return Math.round(decimal* num) / decimal;
}

---

Easy The tween is updating after the enter frame event fires.
You should never use the enterframe event to control UI like this.
remove this line completely.

stage.addEventListener(Event.ENTER_FRAME,upd)

And add this line in your go function.

var xPosT = new Tween(mc, "x", Strong.easeOut, 600, 0, 3,true);
xPosT.addEventListener( TweenEvent.MOTION_CHANGE, upd )

MOTION_CHANGE fires after the tween update.
Also note you have to consider garbage collection, because if this app runsfor an extended period it will have issues