반응형
Google Maps API 3 : 오른쪽 클릭으로 좌표 얻기
사용자가 db에 새 레코드를 입력 할 때 위도 및 경도에 대한 2 개의 텍스트 상자가 있습니다.
잘 작동하는 Google지도의 실시간 미리보기가 있습니다. 이제 클릭 한 좌표로 위도 / 경도 텍스트 상자를 채우는 마우스 오른쪽 버튼 클릭 이벤트를지도에 추가하고 싶습니다.
이것이 가능할까요?
이벤트 리스너를 추가하는 방법을 알고 API 문서를 살펴 보았지만이 작업을 수행하는 항목은 보이지 않았습니다. 나는 당신이 그들의 웹 사이트에있는 구글의지도에서 그것을 할 수 있다는 것을 안다.
google.maps.event.addListener(map, "rightclick", function(event) {
var lat = event.latLng.lat();
var lng = event.latLng.lng();
// populate yor box/field with lat, lng
alert("Lat=" + lat + "; Lng=" + lng);
});
당신은 만들 수 개의 InfoWindow 객체 ( 여기 클래스 문서를 )과에 첨부 rightclick
지도에서 클릭 된 위치의 위도와 경도로 채 웁니다 이벤트 핸들러를.
function initMap() {
var myOptions = {
zoom: 6,
center: new google.maps.LatLng(-33.8688, 151.2093)
},
map = new google.maps.Map(document.getElementById('map-canvas'), myOptions),
marker = new google.maps.Marker({
map: map,
}),
infowindow = new google.maps.InfoWindow;
map.addListener('rightclick', function(e) {
map.setCenter(e.latLng);
marker.setPosition(e.latLng);
infowindow.setContent("Latitude: " + e.latLng.lat() +
"<br>" + "Longitude: " + e.latLng.lng());
infowindow.open(map, marker);
});
}
html,
body {
height: 100%;
}
#map-canvas {
height: 100%;
width: 100%;
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAIPPUQ0PSWMjTsgvIWRRcJv3LGfRzGmnA&callback=initMap" async defer></script>
<div id="map-canvas"></div>
참고URL : https://stackoverflow.com/questions/7905733/google-maps-api-3-get-coordinates-from-right-click
반응형
'developer tip' 카테고리의 다른 글
C #에서 디렉터리 찾아보기 (0) | 2020.12.14 |
---|---|
C #을 사용하여 시스템 가동 시간 검색 (0) | 2020.12.14 |
해시 키 / 값을 배열로 (0) | 2020.12.14 |
Apple Development Push Services의 개인 키를 찾을 수 없습니다. (0) | 2020.12.14 |
Node js 오류 : 프로토콜“https :”가 지원되지 않습니다. (0) | 2020.12.14 |