2010-08-23 6 views
16

Google지도를 사용한 경험이 없지만 웹 응용 프로그램에 '카운티 선택'지도를 포함시키고 싶습니다. 내 응용 프로그램은 캘리포니아 만 대상으로하므로 하나의 상태 만 지원하면되지만 모든 손쉽게 오버레이 폴리곤을 그리지 않고도 쉽게이 작업을 수행 할 수 있습니다.카운티 오버레이가있는 Google지도가 있습니까?

Google에서 "카운티 선택"스타일 인터페이스를 쉽게 찾을 수 있다고 가정했지만이 사실은 내가 발견 한 유일한 것입니다. - http://maps.huge.info/county.htm - 나는 그들의 API를 향해 기울고 있습니다. 더 나은 옵션을 찾을 수없는 경우 전체 상태에 대한 도형을 가져옵니다.

누구나 쉽게 경험할 수있는 경험이나 통찰력이 있습니까?

답변

14

Google 퓨전 테이블은 이제 미국 전체에 대해 State, County, and Congressional District data에 연결됩니다.

융합 테이블의 지오메트리 필드에는 지정된 개체의 다각형 요소가 포함됩니다. 그들의 주 경계선 인 다각형 (그리고 더 작은 범위는 군)은 몇 군데에서 약간 낮은 해상도를 보였지만, 당신에게 충분히 좋을 수 있고 잡기는 비교적 쉬워야합니다.

30

Google지도 API는 카운티 다각형 또는 국가 또는 국가의 사전 정의 된 테두리를 제공하지 않습니다. 따라서 여기서 가장 중요한 문제는 다각형 데이터를 얻는 것입니다.

Google지도 API에 다각형 (당신이 V3의 API를 사용하는 가정) LatLng 객체의 배열을 구성하여 정의된다

var bermudaTriangleCoords = [ 
    new google.maps.LatLng(25.774252, -80.190262), 
    new google.maps.LatLng(18.466465, -66.118292), 
    new google.maps.LatLng(32.321384, -64.757370), 
    new google.maps.LatLng(25.774252, -80.190262) 
];  

그런 다음 당신이 Polygon 객체를 생성하기 위해이 배열을 사용합니다 :

bermudaTriangle.setMap(map); // Assuming map is your google.maps.Map object 
:

var bermudaTriangle = new google.maps.Polygon({ 
    paths: bermudaTriangleCoords, 
    strokeColor: '#FF0000', 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: '#FF0000', 
    fillOpacity: 0.35 
}); 

그리고 마지막으로는 setMap() 메소드를 호출하여지도에 표시 당신이 당신의 Polygon 객체에 대한 참조를 유지하는 경우

, 당신은 또한 setMap() 방법에 null를 전달하여 숨길 수 :

bermudaTriangle.setMap(null); 

따라서 각 카운티의 속성 이름과 자바 스크립트 객체를 구축 고려할 수 있습니다. 이렇게하면 모든 컬렉션을 반복하지 않고도 O(1) (일정 시간)에있는 카운티 이름에서 폴리곤 객체를 가져올 수 있습니다. 다음 예제를 고려하십시오.

// Let's start with an empty object: 
var counties = {  
}; 

// Now let's add a county polygon: 
counties['Alameda'] = new google.maps.Polygon({ 
    paths: [ 
    // This is not real data: 
    new google.maps.LatLng(25.774252, -80.190262), 
    new google.maps.LatLng(18.466465, -66.118292), 
    new google.maps.LatLng(32.321384, -64.757370), 
    new google.maps.LatLng(25.774252, -80.190262) 
    // ... 
    ], 
    strokeColor: '#FF0000', 
    strokeOpacity: 0.8, 
    strokeWeight: 2, 
    fillColor: '#FF0000", 
    fillOpacity: 0.3' 
}); 

// Next county: 
counties['Alpine'] = new google.maps.Polygon({ 
    // Same stuff 
}); 

// And so on... 

counties 개체는 Google 데이터 저장소가됩니다. "엘도라도"에 대한 사용자 검색을 사용하면 다각형을 보여 간단 수있는 경우 다음과 같이

:

counties['El Dorado'].setMap(map); 

당신이 이전에 검색 카운티에 대한 참조를 유지하는 경우, 당신은 또한 이전 다각형을 숨길 setMap(null)를 호출 할 수 있습니다

var userInput = 'El Dorado'; 
var latestSearch = null; 

// Check if the county exists in our data store: 
if (counties.hasOwnProperty(userInput)) { 
    // It does - So hide the previous polygon if there was one: 
    if (latestSearch) { 
    latestSearch.setMap(null); 
    } 
    // Show the polygon for the searched county: 
    latestSearch = counties[userInput].setMap(map); 
} 
else { 
    alert('Error: The ' + userInput + ' county was not found'); 
} 

나는 이것이 올바른 방향으로 나아갈 수 있기를 바랍니다.

관련 문제