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');
}
나는 이것이 올바른 방향으로 나아갈 수 있기를 바랍니다.