當鼠標懸停在文本上時丟失懸停

我正在試圖將一組路徑和文本懸停在Raphael中。懸停時，我需要更改路徑的顏色，而不是文本。目前，我的代碼不知道哪個集合正在被徘徊，並且僅僅改變了數組的最後一個元素。當鼠標懸停在文本上時丟失懸停

這可能是一個愚蠢的錯誤，但我難倒:)

這裏是我的小提琴：http://jsfiddle.net/Kiaaanabal/znacD/1/

function hexHoverIn() { 
    hex.attr({fill: '#00411a'}); 
    console.log("Hovering Set" + i); 
} //hexHoverIn 

function hexHoverOut() { 
    hex.attr({gradient: '70-#004838-#028151'}); 
} //hexHoverOut 

var hexArray = new Array(); 

for(var i = 0; i < hexData.length; i++) { 
    var hex = paper.path(hexData[i].pathData); 
    hex.attr({rotation: hexData[i].rotation, gradient: '70-#004838-#028151', stroke: '#CFD4D7', 'stroke-width': 5, cursor: 'pointer' }); 

    var hexText = paper.text(hexData[i].xPos, hexData[i].yPos, hexData[i].text); 
    hexText.attr({fill: '#fff', 'font-size': 10, 'font-family': 'Arial', cursor: 'pointer'}); 

    hexArray[i] = paper.set(); 
    hexArray[i].push(hex, hexText).hover(hexHoverIn, hexHoverOut); 
}

來源

2013-10-04 kiaaanabal

你沒做完的實施，請參閱我的小提琴http://jsfiddle.net/m4Z2K/與顯示正確的效果馮想:)

晴我的變化是：

1.Declare一個HashMap的for循環之前，這是爲了保存所有的路徑對象

var hexObjectMap ={}; // maintain a hashmap for all the path object

2.使用（參見documentation爲Element.data（）API的詳細信息）數據（）以保存的ID中的每個對象

hex.data('key',i); // save a identifier in each object

3。保存路徑對象在地圖六角創建

hexObjectMap[i] = hex; // save each path object to map

4.In hexHoverIn（）和hexHoverOut（後），從對象（這得到id列將是路徑對象使用[R目前懸停）

var key = this.data('key'); // retrieve the 'key' in this path object

與hexObjectMap取代六角 [關鍵]因爲六角只停留參考最後創建的路徑對象。

hexObjectMap[key].attr({fill:'#00411a'});

讓我知道，如果你有未來的問題，享受。

來源

2013-11-06 16:38:40

非常感謝你看看這個！你解決了它的一部分，只是使用** this **導致六角形懸停在文本上時失去懸停（至少這是我認爲造成的）。無論如何，我們最終找到了另一種解決方案，但我會看看您的解決方案！再次感謝！ – kiaaanabal

哦，這是一個棘手的部分，在我的Web應用程序中，我通過附加文本對象的懸停效果來解決此問題：hexText.hover（textHoverIn，textHoverOut），並且還需要將數據保存在hextText中以用於懸停功能。 –

當鼠標懸停在文本上時丟失懸停

回答

相關問題