1

我有路径，然后用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。

4

1 回答 1

7

你也必须调整路径！只需在Raphaël Playground上试一试。

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

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

star.transform("s2");

像以前一样调整它的大小2x。

如果不想编辑路径并简单地对其进行缩放，则应使用该transform方法将其大小和translate完整路径调整一定值。

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

例如，这32px将从顶部和32px左侧移动对象并将其大小调整为2x与以前一样。

于 2012-05-21T08:19:56.293 回答