Snap.svg - 如何總是用一條線連接兩個對象？

Question

我們如何總是用Snap.svg中的一行連接兩個對象？

Plunkr：https://plnkr.co/edit/IgY0jyHbWTLuH4FfZt6o?p=preview

var circleOne = s.circle(150, 150, 100); 
var circleTwo = s.circle(450, 450, 100); 
var boxOne = circleOne.getBBox(); 
var boxTwo = circleTwo.getBBox(); 
var line = s.line(boxOne.cx, boxOne.cy, boxTwo.cx, boxTwo.cy); 
line.attr({ 
    stroke: 'red' 
}); 

var t = new Snap.Matrix(); 
t.translate(200, 0, boxTwo.cx, boxTwo.cy); 
setTimeout(function() { 
    circleTwo.animate({ transform: t}, 500, mina.easein); 
}, 1000); 

Answer 1

沒關係，理解了它！

setTimeout(function() { 
    circleTwo.animate({ transform: t}, 500, mina.easein); 
    line.animate({ 
    x2: boxTwo.cx + 200 
    }, 500, mina.easein); 
}, 1000); 

https://plnkr.co/edit/IgY0jyHbWTLuH4FfZt6o?p=preview