01.<!DOCTYPE html>
02.<html>
03. <head>
04. <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
05. <meta charset="utf-8">
06. <title>Reverse Geocoding</title>
07. <style>
08.
09.
10. #map {
11. height: 500px;
12. width: 600px;
13. }
14.
15. html {
16. height: 100%;
17. margin: 0;
18. padding: 0;
19. text-align: center;
20. }
21. #floating-panel {
22. position: absolute;
23. top: 5px;
24. left: 30%;
25. margin-left: -180px;
26. width: 350px;
27. z-index: 5;
28. background-color: #fff;
29. padding: 5px;
30. border: 1px solid #999;
31. }
32. #latlng {
33. width: 225px;
34. }
35. </style>
36. </head>
37. <body>
38. <div id="floating-panel">
39. <input id="latlng" type="text" value="13.847860,100.604274">
40. <input id="submit" type="button" value="Reverse Geocode">
41. </div>
42. <div id="map"></div>
43. <script>
44. function initMap() {
45. var map = new google.maps.Map(document.getElementById('map'), {
46. zoom: 15,
47. center: {lat: 13.847860, lng: 100.604274},
48. });
49. var geocoder = new google.maps.Geocoder;
50. var infowindow = new google.maps.InfoWindow;
51.
52. document.getElementById('submit').addEventListener('click', function() {
53. geocodeLatLng(geocoder, map, infowindow);
54. });
55. }
56.
57. function geocodeLatLng(geocoder, map, infowindow) {
58. var input = document.getElementById('latlng').value;
59. var latlngStr = input.split(',', 2);
60. var latlng = {lat: parseFloat(latlngStr[0]), lng: parseFloat(latlngStr[1])};
61. geocoder.geocode({'location': latlng}, function(results, status) {
62. if (status === 'OK') {
63. if (results[1]) {
64. map.setZoom(11);
65. var marker = new google.maps.Marker({
66. position: latlng,
67. map: map
68. });
69. infowindow.setContent(results[1].formatted_address);
70. infowindow.open(map, marker);
71. } else {
72. window.alert('No results found');
73. }
74. } else {
75. window.alert('Geocoder failed due to: ' + status);
76. }
77. });
78. }
79. </script>
80. <script async defer
82. </script>
83. </body>
84.</html>
ช่วยกันสนับสนุนรักษาเว็บไซต์ความรู้แห่งนี้ไว้ด้วยการสนับสนุน 
