Raphael JS で明らかな何かが欠けています。私は、a) 配列をループし、b) 値から円を描き、c) テキスト オーバーレイを作成し、d) Raphael でリスナーを設定しています。
私が苦労しているのは、リスナーのアクションです。具体的には、ID で要素を取得し、それを一番上に移動するなどの操作を行うにはどうすればよいですか。
JSFiddle のソース http://jsfiddle.net/NPks2/3/
私はこれがうまくいくことを期待していますが、そうではありません。手伝ってくれますか?
// this happening while looping through an object
var p = paper.circle(x_coord, y_coord, diameter)
.data("i", i)
.attr({"fill": "90-"+fillColorStart+":5-"+fillColorEnd+":95","fill-opacity": 0.5})
.glow({color: "#4b4b4b", width: 7})
paper.text(x_coord, y_coord, opportunityTitle)
.data("text_id", i+"text")
.attr({ "font-size": 16, "font-family": fontFamily, "fill":fontColor});
paper.text(x_coord, title_y_coord, ideasCount)
.attr({ "font-size": 27, "font-family": fontFamily, "fill":fontColor});
// loop is over, listeners are waiting
paper.forEach(function(element) {
element.mouseover(function() {
c = elem_id = this.data("i");
t = p.getById(elem_id"+text);
c.toFront();
t.toFront();
});
});