Замыкания чуть чуть не стандартный вариант
Подскажите, пожалуйста.
Первый раз столкнулся с необходимостью использовать замыкания. Делаю на SVG карту. И необходимо для большого количества городов выполнить следующее.
for(var i=0;i<city.length;i++){
city[i].svg = R.circle(city[i].x,city[i].y,3).attr({fill: "270-#f2c01f-#fe9400",stroke:"270-#f2c01f-#fe9400"});
city[i].svg.mouseover(function(e,i){
city[i].svg.animate({r:10},1000);
city[i].svgText.show();
});
city[i].svg.mouseout(function(e){
city[i].svg.animate({r:3},1000);
city[i].svgText.hide();
});
city[i].svgText = R.text(int(city[i].x)+20, int(city[i].y)-20, city[0].name).attr(attr_font).hide();
}
В
city[i].svg.mouseover(function(e,i){
city[i].svg.animate({r:10},1000);
city[i].svgText.show();
});
У
city[i].svg.animate({r:10},1000);
city[i].svgText.show();
У i значение максимума при прохождении цикла. Пробовал как с статье написано про замыкания сделать, но там случай когда
divs[i].onclick = function(x) {
return function() { alert(x) }
}(i);
А здесь функция передается как аргумент. Уже столькими способами пробовал. Ни думал, что когда-нибудь столкнусь с необходимостью использовать замыкания. |
Разобрался вот так надо.
city[i].svg.mouseover((function(i){
return function(e){
city[i].svg.animate({r:10},1000);
city[i].svgText.show();
}
)(i));
city[i].svg.mouseout((function(i){
return function(e){
city[i].svg.animate({r:3},1000);
city[i].svgText.hide();
}
})(i));
|
либо можно просто вынести обработчики в отдельные функции/методы:
for(var i=0;i<city.length;i++){
city[i].svg = R.circle(city[i].x,city[i].y,3).attr({fill: "270-#f2c01f-#fe9400",stroke:"270-#f2c01f-#fe9400"});
city[i].svg.mouseover( mouseover(city[i]) );
function mouseover( city ){
return function(){
city.svg.animate({r:10},1000);
city.svgText.show();
};
}
или даже так, если написать функцию pass:
for(var i=0;i<city.length;i++){
city[i].svg = R.circle(city[i].x,city[i].y,3).attr({fill: "270-#f2c01f-#fe9400",stroke:"270-#f2c01f-#fe9400"});
city[i].svg.mouseover( mouseover.pass(city[i]) );
function mouseover( city ){
city.svg.animate({r:10},1000);
city.svgText.show();
}
|
Спасибо за совет.
|
| Часовой пояс GMT +3, время: 04:01. |