2012-04-09 7 views
1

jVectorMapを使い始めました。クリックして国を選択し、ユーザーが新しい国を選択するまで、選択した国を色づけしたいと考えています。私がここで間違っていることを理解できませんか?jVectorMap onRegionClickの色を変更する

$(function() { 
    function showSelectedCountry(event, code) { 
     viewModel.selectedCountry(code); 
     $('#map').vectorMap('set', 'colors', {code: '#f00' }); 
    } 

    $('#map').vectorMap({ 
     hoverColor: '#f00', 
     backgroundColor: '#C8C8C8', 
     onRegionClick: showSelectedCountry 
    }); 
}); 

答えて

2

私は同じ問題であると思われるものに遭遇しました。私はあなたのように色を設定していましたが、この色はうまくいきません。 regionMouseOutが '選択された'色を元の値に戻していたことが判明しました。選択した国のregionMouseOutに対するデフォルトアクションを防止するか、マウスで色を設定し直してください(後で私のために働くことができます)。

// Prevent selected country colour being changed on mouseOut event 
$('#map').bind('regionMouseOut.jvectormap', function(event, code){ 
    if(code == selectedCountry) { 
     var data = {}; 
     data[code] = "#0000ff"; 
     $("#map").vectorMap("set", "colors", data); 
    } 
}); 

「コード」はvar値の代わりに文字列として渡されました。それは(もはや?)ではありませんregionMouseOut

onRegionOver: function(e,code){e.preventDefault();} 

$(function() { 
    function showSelectedCountry(event, code) { 
     viewModel.selectedCountry(code); 
     var data = {}; 
     data[code] = "#f00";    
     $('#map').vectorMap('set', 'colors', data); 
    } 

    $('#map').vectorMap({ 
     hoverColor: '#f00', 
     backgroundColor: '#C8C8C8', 
     onRegionClick: showSelectedCountry 
    }); 
}); 
0

少し遅れて、しかし(私が行ったように)それらのために、まだ検索the event is called

:あなたは少しあなたの元を変更する必要がないかもしれません