如何改变Raphael JS绘制的路径宽度和高度？

Question

我有路径,然后我用Raphael JS画.代码如下所示:

var paper = Raphael($('#draw_here')[0], '32', '32');

var star = paper.path("M 22.137,19.625 32,12 20,12 16,0 12,12 0,12 9.875,19.594 6,32 16.016,24.32 26.008,32 z");

star.attr({
    fill: 'white',
    stroke: 'black',
    title: 'This is a STAAAAAAAR!'
});

它工作,它绘制32 x 32像素的大明星.如何改变它的宽度和高度？

我试着这样做:

var paper = Raphael($('#draw_here')[0], 64, 64);

var star = paper.path("M 22.137,19.625 32,12 20,12 16,0 12,12 0,12 9.875,19.594 6,32 16.016,24.32 26.008,32 z");

star.attr({
    fill: 'white',
    stroke: 'black',
    title: 'This is a STAAAAAAAR!',
    width: 64,
    height: 64
});

...但所有变化都是"纸元素"的宽度和高度,而不是明星的.

我想要做的就是当鼠标的光标在它上面时,星形会变大.

谢谢你的建议!

PS我自己没有写路径,它来自Iconic set.

Answer 1

你也必须调整路径!只需在Raphaël游乐场尝试一下.

width和height属性只是要绘制的元素的大小,但路径坐标仍然相同.

对于简单的调整大小,您也可以使用

star.transform("s2");

将其调整2x为以前的大小.

如果不想编辑路径并对其进行简单缩放,则应使用该transform方法将其调整大小并将translate完整路径调整为某个值.

star.transform("t32,32 s2");

例如,这32px将从顶部和32px左侧移动对象,并将其调整2x为之前的大小.