How to create a shape copy?

[vswamina]

Hi,

What is the best way to create a copy of a shape? I tried the
following code the problem is that the rotation does not apply and
scale applies twice. Is there a existing Raphael method for the same
or any plugin out there which can do this?

function clone(shape){
var cloneObj;
switch(shape.type){
case 'path':
cloneObj = shape.paper.path(shape.attrs.path);
break;
case 'circle':
cloneObj = shape.paper.circle(shape.attrs.x, shape.attrs.y,
shape.attrs.r);
break;
case 'ellipse':
cloneObj = shape.paper.ellipse(shape.attrs.x, shape.attrs.y,
shape.attrs.rx, shape.attrs.ry);
break;
case 'rect':
if(shape.attrs.r)
cloneObj = shape.paper.rect(shape.attrs.x, shape.attrs.y,
shape.attrs.width, shape.attrs.height, shape.attrs.r);
else
cloneObj = shape.paper.rect(shape.attrs.x, shape.attrs.y,
shape.attrs.width, shape.attrs.height);
break;
}

cloneObj.attr(shape.attrs);
cloneObj.translate(5,5); //just to put the cloned shape a little away
from the original
return cloneObj;
}

[Dmitry Baranovskiy]

Who told you that you can use shape.attrs object?

What about this:
function clone(shape) {
paper[shape.type]().attr(shape.attr()).translate(5, 5);
}

You would like to have it in Raphael code? Like element.clone()?

> --
>
> You received this message because you are subscribed to the Google
> Groups "Raphaël" group.
> To post to this group, send an email to raph...@googlegroups.com.
> To unsubscribe from this group, send email to raphaeljs+...@googlegroups.com
> .
> For more options, visit this group at http://groups.google.com/group/raphaeljs?hl=en-GB
> .
>
>

[vswamina]

I did not ask anyone, I just used it :-)

It would be great to have it out of box in Raphael code!

Thanks Dmitry. Would this snippet also solve the rotate issue I
mentioned? I will check it out.

On Dec 15, 5:15 am, Dmitry Baranovskiy <dmitry.baranovs...@gmail.com>
wrote:

[vswamina]

Hi Dmitry,

I checked it out, the rotation of the parent shape does not apply in
the clone, as the rotation does not seem to be captured in the attrs
object unlike translation which is stored in attrs. Also, in this
approach, scaling gets replicated everytime you clone.

c = paper.ellipse(150,350,70,50).attr({stroke:'red'}).scale
(1,2).c.rotate(45).c.translate(10,10);
d = clone(c).attr({stroke:'blue'});

In this example, the shape attributes including translation gets
applied in the clone except for rotation which does not get applied at
all and scaling which is applied once more on the cloned object. So we
get a mutated clone!, could not avoid the pun :-)

[vswamina]

Wow! Native support for clone in 1.2.7! :-) Thanks Dmitry, even the
rotation issue is now applied

Please, please also solve the scaling issue in clone, try the code
below in PG to see the issue, the scale attrib distorts cloning

c = paper.ellipse(250,200,40,20).attr({stroke:'red'}).scale(2,2).rotate
(45).translate(10,10);
d = c.clone().translate(5, 5).attr({stroke:'blue'}); //scale gets
applied again when cloned

c = paper.ellipse(50,200,40,20).attr({stroke:'red'}).rotate
(45).translate(10,10);
d = c.clone().translate(5, 5).attr({stroke:'blue'}); //when no scaling
is done, cloning works perfectly

Thanks,
Vignesh

[vswamina]

For now a workaround for the double scaling in clone method

c = paper.ellipse(150,350,70,50).attr({stroke:'red'}).scale(2,2).rotate
(45).translate(10,10);
d = c.clone().translate(5, 5).attr({stroke:'blue'}).scale(1,1);

scale back the cloned shape by applying scale(1,1)

Thanks
Vignesh