使用 Raphael 动画不透明度

Question

我成功地制作了一个小地图，在鼠标悬停时显示 .SVG。它立即显示图像，然后离开鼠标。我尝试添加“.animate”属性以使它们淡入淡出，但我尝试过的每一种方式都失败了？希望得到一个快速的解释！

var rsr = Raphael('map', '900', '900');

变量区域 = [];

var circle_a = rsr.circle(584, 556, 88); circle_a.attr({fill: '#2a4b4d',opacity: '0'}).data({'id': 'circle_a', 'region': 'Circle A'}); region.push(circle_a);

for (var i = 0; i

regions[i].mouseover(function(e){
  this.node.style.opacity = 1;
});

regions[i].mouseout(function(e){
    this.node.style.opacity = 0;
});

}

Answer 1

regions[i].mouseover(function(e){
  circle_a.animate({ "fill-opacity": "1" }, 2000);
    document.getElementById('region-name').innerHTML = this.data('region');
});

regions[i].mouseout(function(e){
circle_a.animate({ "fill-opacity": "0" }, 2000);
});