raphael + mapSvg fadeout

Question

我需要一些帮助，我在此代码中使用mapSVG创建了我的国家/地区的地图，其中每个地区都有自己的路径，其中包含自己的 ID ，所以这就是我想要的：

当我点击一个区域时，我需要它与国家的整个地图淡出（1000毫秒），然后我需要延迟例如500毫秒，之后只有我点击的区域消失在（1000毫秒）。

我需要分别为每个地区工作。

<div id="italy" style="margin-left:135px;margin-right:135px;">
            <!-- Here comes map code-->
            <script type="text/javascript">
            $('#italy').mapSvg({
                source: 'maps/italy.svg',
                colors: {
                        base: "#E1F1F1",
                        stroke: "#646464",
                        hover: "#548eac",
                        selected: "#548eac",
                        disabled: "#ffffff",
                    },
                tooltipsMode: 'custom',   
                popover : {width: 300, height: 300},
                cursor: 'pointer',
                zoom: false,
                pan: false,
                responsive: true,
                width: 900,
                height: 600,
                responsive: true,  
                zoomButtons: {'show': false, 
                },
                regions : {
                  'Sicilia'  : {tooltip: 'This is Sicilia'},
                },
                onClick : function(e,m){
                this.animate({opacity: 0}, 1000 );
                }
            });
            </script>
        </div>

Answer 1

我是mapSVG的开发人员:)试试这个：

onClick: function (e, m) {
    var rmap = m.getData().RMap;
    var region = this;
    var fadeBack = function () {region.animate({opacity: 1}, 500);};
    rmap.animate({opacity: 0}, 500, fadeBack);
}