有人能澄清拉斐尔的文件吗?(或者知道一个地方已经有人这么做了)

Can someone clarify Raphael's documentation? (or know a place in which someone already has done it)

本文关键字：一个 或者 文件      更新时间：2023-09-26

我正在使用Raphael，我认为我使用它的方式没有利用一些似乎有用的功能。

例如，我试图在Set(一组元素)上添加一个监听器，当鼠标移到这些元素上时，脚本会触发整个Set的动画。

当你向集合中添加一个监听器时，Raphael会将监听器添加到每个元素中，并分别将它们动画化。

就像你在这个例子http://jsfiddle.net/4VYHe/3/中看到的那样，我想让所有的矩形在同一个集合中(set = 10个矩形的水平组)，改变鼠标在其中任何一个上的颜色属性。

我在raphael文档中找到了一些方法，我认为必须帮助实现这一点。但是我很难理解这些方法是如何工作的。

例如:

  • eve对象(http://raphaeljs.com/reference.html#eve)
  • Element.animateWith()方法(http://raphaeljs.com/reference.html#Element.animateWith)
  • 拉斐尔。动画()方法(http://raphaeljs.com/reference.html#Raphael.animation)

拉斐尔库似乎真的很强大，我真的想让它正常工作，我不想写各种不同的javascript hack，因为我认为这些工具必须以更优雅的方式完成工作。

如果你认为我用错了库，我仍然愿意接受各种建议。提前谢谢你。

——编辑——

这是一个工作示例(http://jsfiddle.net/4VYHe/6/)。但这是一个缺乏效率和优雅的黑客。我想要用正确的方法使用正确的工具。

这一页有一些信息。http://www.irunmywebsite.com/raphael/additionalhelp.php?v=2 PAGETOP。有几个例子，但没有一个能解释拉斐尔的作品是如何运作的。

看看这个小提琴，我想它正在做你正在寻找的东西。最根本的区别是，你想在集合上调用animate，而不是this。看起来，当您向集合添加处理程序时，this指向集合中的单个元素(通过迭代来分配处理程序)，而不是集合本身。

注意，我将处理程序函数拉到getHoverHandler函数中:

function getHoverHandler(fillColor) {
     var cSet = set;
     return function(){
          cSet.animate({fill: fillColor}, 300);
      };
}
set.hover(getHoverHandler('#000'),
          getHoverHandler('#FFF'));

以打破闭包。如果你试着这样做:

set.hover(function(){
            set.animate({fill: '#000'}, 300)
        }, function(){
            set.animate({fill: '#FFF'}, 300)
        });

在循环时，set将不断变化，闭包将保持对这一点的感知。因此，所有处理程序都将作用于最后一行框。

如果你不懂javascript闭包，你可能想看看这篇文章。它很老了，但是语言很简单，它帮助了我，因为我试着去理解它们。

Kreek在上面的评论是绝对正确的。集合是解决SVG和VML之间不一致的一种方法。

在你上面的例子中，你遇到了你在上一个问题中遇到的同样的问题。在匿名函数中使用this几乎总是不会以您期望的方式工作，因为this不会引用您认为它是什么。看看这个讨论，特别是评论部分的前两条评论。(顺便说一句，评论者用"self"来指代"this"，这比我的"that"要好得多，这说明总有人比你做得更好)

无论如何，考虑到这一点，我已经克隆了您的小提琴，将您的集合包装在对象中，并将事件放入对象构造函数中。通过这样做，事件可以引用。set并同时对集合中的所有对象进行动画。

这是一个小而基本的概念，它将帮助你在任何拉斐尔(或javascript)开发。

这并不能直接回答你的问题，但希望能澄清一些你似乎发现的问题。我真的不能评论你提到的动画调用，但我确实认为拉斐尔作为一个库绝对值得坚持下去。

n .

相关文章：