Question

I have a list of countries in a ul and when they are clicked I am trying to highlight them on the map - the problem I have is when another country is clicked I want to deselect all the countries and only highlight this one. At the moment if you click on another country they just stay selected, im presuming im doing something wrong when using clearSelectedRegions(); on the below.

Or maybe I am completely over complicating the whole thing?

$('ul').on('click', 'a:first-child', function (event) {
    var elem = event.target,
        evtype = event.type,
        cntrycode = findRegion(mapObj2.regions, $(elem).text());

    if (evtype === 'click') {
        mapObj2.clearSelectedRegions();
        mapObj2.regions[cntrycode].element.setHovered(true);
    }
});

http://jsfiddle.net/wWFG2/

Was it helpful?

Solution

Yes, you're over complicating the whole thing, just set regionsSelectableOne option to true and use setSelectedRegions instead of setHovered, which has nothing to do with selected state. See updated fiddle:

if (evtype === 'click') {
    mapObj2.clearSelectedRegions();
    mapObj2.setSelectedRegions([cntrycode]);
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top