在拉斐尔的多个圈子之前插入图像的问题

Question

这是Running Demo提供问题

我正在尝试更改Raphael Paper的背景图片，该图片已经从现有数组中绘制了一些点（圆圈）

var coords = [
               [ 218.5149144 , 215.5990218 ],
               [ 705.5489248 , 587.6430517 ],
               [ 297.0329404 , 360.5962827 ],
               [ 235.9094655 , 372.6983263 ],
               [ 400.8240728 , 486.9852929 ]
              ];

for(var i = 0; i < coords.length; i++){
    (function() {
                var circle; 
                circle = map.circle(coords[i][0], coords[i][1], 6);
                circle.toFront();
                circle.attr({
                             fill: '#f63832',
                             translation: "4,4",
                             stroke: '#FFF',
                            'stroke-width': 2,
                             opacity: 1,
                             });
    circle.hover(
                 function () {
                              circle.animate({
                                              fill: 'red',
                                              opacity: .6,
                                              r: 8,
                                             'stroke-width': 2.5
                                              }, 300)
                 }, function () {
                               circle.animate({
                                              fill: '#f63832',
                                              opacity: 1,
                                             'stroke-width': 2,
                                              r: 6
                                              }, 300)
                        }    );
                 })();
 };

$("#change").on("click",function(){
    image2.animate({ opacity: 0}, 500, mina.easein, function(){image2.remove();
                  image2  = map.image('http://localhost:8888/Ep/img/image2.png', -100, 0, 794, 680).insertBefore( circle ).animate({ opacity: 1, x: 0 }, 500, mina.easeout) ;                  
 });

});

现在我在.insertBefore( circle )部分出现问题，该部分无法识别圆圈对象，我在控制台上出现以下错误

  

未捕获的ReferenceError：未定义圆

所以我决定从循环内部删除var circle;并在全局范围内声明它修复了.insertBefore( circle )问题但是在这种情况下我失去了悬停功能点！ 你能告诉我怎么解决这个问题吗？感谢

  

更新

我只是忘了提到从循环中删除var circle;并在脚本顶部声明它会在最后的点后插入Imaeg。

这是Running Demo提供问题