jVectorMap 표시가 선택된 상태

Question

내가 플러그인 jVectorMap을 발견하고 나는 내가 diferente 색상

가져가 발생 동일한 방법으로 선택한 상태를 표시하기 위해 노력하고있어,하지만 난입니다, 클릭 할 때를 원하는 상태는 어떤 색으로 "활성"상태를 유지합니다.

$('#map-teste').vectorMap({ 
    map: 'br_en', 
    onRegionClick: function(event, code){ 
     alert(code); // return the state 
    } 
}); 

하지만 난이 작업을 수행하는 방법에 어떤 생각을 가지고 있겠지 :

플러그인 onRegionClick 같은 일부 작업이 있습니다.

누구나 이것을 얻을 수 있습니까?

Answer 1

이 작업을 수행 할 수 있습니다

$('#map-teste').vectorMap({ 
    map: 'br_en', 
    onRegionClick: function(event, code){ 
     $('#map-teste').vectorMap('set', 'colors', code, '#000000'); 
     alert(code); // return the state 
    } 
}); 

작품 벌금을 내게. 이렇게하면 전환하지 않고 여러 선택을 할 수 있습니다. '단일 선택'효과로 '토글'해야하는 경우 다음과 같이 할 수 있습니다.

currentSelected = ''; 
defaultColor = '#00FF00'; 
selectedColor = '#FF00FF'; 
maphandle = $('#map-teste'); 

maphandle.vectorMap({ 
    map: 'br_en', 
    onRegionClick: function(event, code){ 
     if(currentSelected !== code) { 
      if(currentSelected !== ''){ 
       // Deselect, then select new choice 
       maphandle.vectorMap('set', 'colors', currentSelected, defaultColor); 
       maphandle.vectorMap('set', 'colors', code, selectedColor); 
       currentSelected = code; 
      } else { 
       // Nothing currently selected, go ahead and select 
       maphandle.vectorMap('set', 'colors', code, selectedColor); 
       currentSelected = code; 
      } 
     } else { 
      // Deselect 
      maphandle.vectorMap('set', 'colors', code, defaultColor); 
      currentSelected = ''; 
     } 
     alert(code); // return the state 
    } 
}); 

희망 하시겠습니까? :)

Answer 2

regionStyle 구성 매개 변수를 맵의 인스턴스화에 추가하여 선택한 영역의 색을 설정할 수 있습니다. regionSelectable을 true로 설정하는 것이 좋습니다.

$('#map-teste').vectorMap({ 
    map: 'br_en', 
    onRegionClick: function(event, code){ 
     alert(code); // return the state 
    }, 
    regionsSelectable: true, 
    regionStyle: { 
     selected: { 
      fill: 'orange' 
     } 
    } 
});