Can I attach/bind text to elements in Raphael?

Question

I'm brand new to Raphael, and I was wondering if there's a way I can draw a rect, and draw text inside of it and attach it somehow, so that when I move and scale the rect, the text moves and scales as well? If not, how could I achieve that effect?

Answer 1

One way would be to use Sets like this:

var paper = Raphael("holder", 200, 200);
paper.setStart();
paper.rect(-50, -50, 100, 100);
paper.text(0, 0, "hello");
var st = paper.setFinish();
st.transform("r10").translate(100, 100);

(On JSFiddle)

Tip: Note that you have to track the rotation axis on your own if you're not using 0,0 as the center. I personally like to keep it at 0,0 and then translate it to wherever I want.