在Raphael.js中查看鼠标悬停的文本

时间:2013-05-03 05:51:26

标签: javascript raphael

我有一些Rapahel圈子,当我悬停在它们上面时,我需要查看一些文字。这是我的代码:

var text = R.text(X, Y, "some text");
R.circle(X, Y, 10).attr({"fill-opacity":0.8, fill:color, stroke: "white"})
        .mouseover(function () {
                this.animate({"fill-opacity": 1, 'transform':"s2 2"}, 500);}
            txt.show();
        })
        .mouseout(function () {
            this.animate({"fill-opacity": 0.8, 'transform':"s0.5 0.5"}, 500);}
            txt.hide();
        });

X和Y在一个循环中计算,在屏幕上显示几个圆圈。问题是文本节目总是最后一个,位置也是固定的。 如何让这段代码工作并将单个文本绑定到每个圆圈?

1 个答案:

答案 0 :(得分:3)

试试这个

var circle = R.circle(X, Y, 10).attr({"fill-opacity":0.8, fill:color, stroke: "white"});

circle.txt = R.text(circle.attr('x'), circle.attr('y'), "some text");

circle.mouseover(function () {
                  this.animate({"fill-opacity": 1, 'transform':"s2 2"}, 500);}
              this.txt.show();
          })
          .mouseout(function () {
              this.animate({"fill-opacity": 0.8, 'transform':"s0.5 0.5"}, 500);}
              this.txt.hide();
          });