AMChars, 외부 버튼을 사용하여 특정 국가로 확대

Question

좋아요, 그래서이지도를 AMCharts에서 ID, LAT 및 Long의 특정 국가가 포함 된 외부 버튼으로 가져 가면 위에 올려 놓으면 확대/축소하고 싶습니다.

http://codepen.io/sheko_elanteko/pen/rjYvgE

var map = AmCharts.makeChart("chartdiv", { 
    "type": "map", 
    "dataProvider": { 
    "map": "worldLow", 
    "getAreasFromMap": true, 
    "areas": [ { 
     "id": "EG", 
     "color": "#67b7dc", 
     "rollOverOutlineColor": "#000", 
     "autoZoom": true, 
     "balloonText": "Egypt" 
     }, { 
     "id": "KZ", 
     "color": "#67b7dc", 
     "rollOverOutlineColor": "#000", 
     "autoZoom": true, 
     "balloonText": "Kazakistan" 
     }, { 
     "id": "US", 
     "color": "#67b7dc", 
     "rollOverOutlineColor": "#000", 
     "autoZoom": true, 
     "balloonText": "United States" 
     }] 
    }, 
    "areasSettings": { 
    "color": "#999", 
    "autoZoom": false, 
    // "selectedColor": "#CC0000", 
    "balloonText": "", 
    "outlineColor": "#fff", 
    "rollOverOutlineColor": "#fff" 
    }, 
    "listeners": [{ 
    "event": "rendered", 
    "method": function(e) { 
     // Let's log initial zoom settings (for home button) 
     var map = e.chart; 
     map.initialZoomLevel = map.zoomLevel(); 
     map.initialZoomLatitude = map.zoomLatitude(); 
     map.initialZoomLongitude = map.zoomLongitude(); 
    } 
    }] 
}); 

function centerMap() { 
    map.zoomToLongLat(map.initialZoomLevel, map.initialZoomLongitude, map.initialZoomLatitude); 
} 

$("button.country").mouseenter(function(event) { 
    event.stopPropagation(); 
    var countryID = $(this).data("id"); 
    var country = map.getObjectById(countryID); 
    var lat = $(this).data("lat"); 
    var long = $(this).data("long"); 
    country.color = '#000'; 
    // map.zoomToSelectedObject(country); 
    map.zoomToLongLat(3, lat, long); 
    country.validate(); 

}).mouseleave(function(event){ 
    event.stopPropagation(); 
    var countryID = $(this).data("id"); 
    var country = map.getObjectById(countryID); 
    country.color = '#CC0000'; 
    country.validate(); 
    centerMap(); 
}); 

당신은 내가, 하드 코딩 각 나라의 좌표를 가지고뿐만 아니라 줌 레벨에서 볼 수 있듯이 있지만, 아무튼를 확대 ... 여기에 코드 예제입니다, 그 나라에 자신을 중심으로 제대로, 특히 미국을 위해 일하지 마라 !!

각 국가의 LAT 및 Long을 가져 와서 하드 코딩하지 않도록하는 방법이 있는지 궁금합니다.

AMCharts에는 "zoomToSelectedObject"라는 함수가 있지만 시도해 보니 행운이있는 객체가 있습니다.

Answer 1

amCharts 'selectObject 메서드를 사용해보세요. 기본 기능이 제공되는지도 객체 (이미 getObjectById를 사용하여 얻을 하나를 확대하는 것입니다 예 :..

$("button.country").mouseenter(function(event) { 

    event.stopPropagation(); 
    var countryID = $(this).data("id"); 
    var country = map.getObjectById(countryID); 
    map.selectObject(country); 

}).mouseleave(...); 

그냥 당신이없이 areasSettings에 "selectable": true를 추가해야하기 위해선,를 selectObject 방법은 '수상 .,

좋은 작품