1

我刚刚开始使用 jVectorMap。我希望能够通过单击选择国家并保持所选国家的颜色,直到用户选择一个新国家。无法弄清楚我在这里做错了什么?

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

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

2 回答 2

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 值传递。您可能需要稍微修改您的原件:

$(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
    });
});
于 2012-04-21T10:54:37.807 回答
0

有点晚了,但是对于那些仍在搜索的人(就像我所做的那样),该事件被称为

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

它不是(不再是?)regionMouseOut

于 2013-08-08T08:56:06.883 回答