javascript - 使用 Raphael 为 SVG 矩形的不透明度设置动画时遇到问题

Question

我正在使用 Raphael 库并尝试将矩形的不透明度从 0 设置为 1。

这是我写的代码：

    this.myRect.attr( 'opacity', 0);
    this.myRect.animate({opacity: 1}, 1000);

这不起作用，我认为这是不正确的动画线，因为我可以将初始属性设置为较低的值，并且在我运行脚本时很明显。

有任何想法吗？

Answer 1

我知道这很旧，但我自己在遇到它后才弄清楚这一点。该属性是“填充-不透明度”而不是填充。所以用

     node.animate({ "fill-opacity": "0.9" }, 200);

Answer 2

$('#'+this.Myrect.node.id).animate({opacity: 1}, 1000);

试试这个方法

Answer 3

在我看来，您的代码问题源于使用this.myrect.. 我假设您已将 myRect 声明为paper.rect(...)，如果是这样，您为什么需要使用this.

看看我模拟的这个快速的 JsFiddle，它基本上表明你应该使用rect.animate()（或者确实是其他一些元素）但不应该使用this. 根据我的个人经验this，在将事件附加到对象时使用。