I have a set of path elements that I'm trying to scale with animation. Based on some demos I've seen this should be possible, but I'm having no luck.

I've tried the following:

set.mouseover(function() {
    this.toFront().animate({'fill':'green', 'scale':'5 5'}, 50);
});

I also attempted things like 'scale':[5, 5] based on some other samples I found. Neither of these of work.

The following does work, but no animation is involved:

set.mouseover(function() {
    this.scale(2, 2);
});

I'm using version 2.0.1 of raphael. Any suggestions about how I can get this to work?

Edit: The discrepancy between examples and my tests are possibly due to the update to Raphael 2, I'm looking into these changes.

I have a set of path elements that I'm trying to scale with animation. Based on some demos I've seen this should be possible, but I'm having no luck.

I've tried the following:

set.mouseover(function() {
    this.toFront().animate({'fill':'green', 'scale':'5 5'}, 50);
});

I also attempted things like 'scale':[5, 5] based on some other samples I found. Neither of these of work.

The following does work, but no animation is involved:

set.mouseover(function() {
    this.scale(2, 2);
});

I'm using version 2.0.1 of raphael. Any suggestions about how I can get this to work?

Edit: The discrepancy between examples and my tests are possibly due to the update to Raphael 2, I'm looking into these changes.

• javascript
• raphael

1 Answer 1

Ok, got it going, it was due to updates with Raphael 2.

The following worked for me:

    this.toFront().animate({'fill':'green', 'transform':"s2 2"}, 50);

Thanks to this thread for helping me figure it out.