Raphael JS 2ホバーイベント

Question

こんにちは私はRaphael JS 2を試していて、すばらしいサークルの円を描いていますが、多くの検索の後にこれらのパスにホバーイベントを実装してカラーを変更する方法がわかりません。

http://jsfiddle.net/goosefat/HYmd2/

Answer 1

このフィドルは、ホバー機能を設定する方法を少し変更します。それがあなたが望むものでないなら、説明してください。

http://jsfiddle.net/vzkxC/1/

ラファエルのドキュメントhttp://raphaeljs.com/reference.html#Element.hoverは、あなたが（私の例では、彼らは両方のcItemだ）第三及び第四パラメータとしてhoverInとhoverOut機能のコンテキストを渡すことができますと言います。これらはコールバック内のthisの値です。

はもちろん、あなたが

Answer 2

編集（forループの外に）適切な範囲にhoverInとhoverOut機能を移動することができ：マルセロの例では、より多くのreadabe /維持することが、彼を使用しています。

あなたはそれを達成するために閉鎖必要があります：あなたはに問題のこの種を処理するためのもう一つの素晴らしい方法は、ここにコード

(function (cItem) { 
    cItem.hover(function(){ 
    cItem.attr({"stroke": "#E3E3E3"}); 
    }, 
    function(){ 
    cItem.attr({"stroke": "#000"}); 
});  
})(cItem) 

http://jsfiddle.net/yxDap/

Answer 3

を：

（のように定義されたイベントハンドラこれ）

var hoverIn = function (item) { 
    return function (event) { 
     self.hoverFlag = true; 
     self.hintElementObj = {}; 
     self._drawHint(paper, event, item); 
    }; 
}; 

実際に

（イベントハンドラは、このように呼ばれる）

paper.rect(x, y, item.rectWidth, item.rectHeight, round).attr({ 
    fill: fill, 
    "stroke-width": 0 
}).hover(hoverIn(item), hoverOut(item)); 

、これはあなたが多くの状況で使用することができますJSのトリックです。それでもっともっと面白いことをすることができます。