使用Google API获取位置的纬度和经度并传递变量(Getting latitude and longitude of a location using Google API and passin

系统教程 行业动态 更新时间:2024-06-14 17:02:17
使用Google API获取位置的纬度和经度并传递变量(Getting latitude and longitude of a location using Google API and passing of variables)

我从Google API获取此代码,我想提取位置的纬度和经度,以便找到它周围最近的10个位置。 使用Javascript:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=mykeyhere&sensor=true"></script> <script type="text/javascript"> var geocoder; var map; function initialize() { geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(14.5833, 120.9667); var mapOptions = { zoom: 8, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); } function codeAddress() { var address = document.getElementById("address").value; geocoder.geocode( { 'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location }); } else { alert("Geocode was not successful for the following reason: " + status); } }); } </script>

身体:

<body onload="initialize()"> <div id="map-canvas" style="width: 320px; height: 480px;"></div> <div> <input id="address" type="textbox"> <input type="button" value="Encode" onclick="codeAddress()"> </div> </body>

有一个文本框,用户将在其中输入位置,javascript会在谷歌地图上放置标记。 如何分别获取纬度和经度并将其传递给html正文 ? 我想要做的是在获得坐标后,我将从数据库中搜索最近的10个位置(纬度和经度是字段)。 然后我如何将标记放到地图上最近的10个位置 ? 请帮帮我。 谢谢!

I got this code from Google API and I want to extract the location's latitude and longitude so I can find the 10 nearest location around it. Javascript:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=mykeyhere&sensor=true"></script> <script type="text/javascript"> var geocoder; var map; function initialize() { geocoder = new google.maps.Geocoder(); var latlng = new google.maps.LatLng(14.5833, 120.9667); var mapOptions = { zoom: 8, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); } function codeAddress() { var address = document.getElementById("address").value; geocoder.geocode( { 'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { map.setCenter(results[0].geometry.location); var marker = new google.maps.Marker({ map: map, position: results[0].geometry.location }); } else { alert("Geocode was not successful for the following reason: " + status); } }); } </script>

Body:

<body onload="initialize()"> <div id="map-canvas" style="width: 320px; height: 480px;"></div> <div> <input id="address" type="textbox"> <input type="button" value="Encode" onclick="codeAddress()"> </div> </body>

There is a textbox where the user will enter a location and the javascript puts a marker on google maps. How can I get the latitude and longitude separately and pass it to the html body? What I'm trying to do is after I get the coordinates, I will search the 10 nearest location from the database (where latitude and longitudes are fields). And then how can I put markers to those 10 nearest locations on the map? Please help me. Thank you!

最满意答案

纬度和经度保存在results[0]但在results[0].location.lat()和results[0].location.lng() 。 这些可以通过指定要应用它们的元素传递回html,并使用信息填充html,例如:

document.getElementById('coords').innerHTML(results[0].location.lat() + ', ' + results[0].location.lng());

要理想地向地图添加新标记,首先需要设置一个数组来保存您创建的标记。 然后,当您有新标记信息时,将它们推送到数组。 这将完成两件事。 一,标记将自动添加到地图中。 其次,如果您需要以任何方式更改标记(可能通过从屏幕清除它们或完全删除它们),您可以对阵列执行操作。

这里有几个与之相关的快速函数(假设您的数组被称为markers 。)

function clearMarkers() { // clears markers but doesn't remove them from the markers array for (var i = 0, l = this.markers.length; i < l; i++) { this.markers[i].setMap(null); } }; function deleteMarkers() { this.markers = []; }

为了向数组中添加标记,您需要对其进行定义,类似于:

function addMarker(latlng) { var marker = new google.maps.Marker({ draggable: false, raiseOnDrag: false, icon: // icon path animation: google.maps.Animation.DROP, position: latlng, // google latlng coords map: // element holding your map }); markers.push(marker); }

您需要的一切都可以在Google Maps API中找到 。

The latitude and longitude are held in your results[0] but under results[0].location.lat() and results[0].location.lng(). These can be passed back to the html by specifying the element you want to apply them to and populate the html with the information, something like:

document.getElementById('coords').innerHTML(results[0].location.lat() + ', ' + results[0].location.lng());

To add new markers to a map ideally you need first to set up an array to hold the markers you create. Then, when you have the new markers information, push them to the array. This will accomplish two things. One, the markers will be automatically added to the map. Second, if you need to change the markers in any way (perhaps by clearing them from the screen, or deleting them altogether) you can perform an action on the array.

Here's a couple of quick functions related to that (assumes your array is called markers.)

function clearMarkers() { // clears markers but doesn't remove them from the markers array for (var i = 0, l = this.markers.length; i < l; i++) { this.markers[i].setMap(null); } }; function deleteMarkers() { this.markers = []; }

In order to add a marker to the array you need to define it, something along the lines of:

function addMarker(latlng) { var marker = new google.maps.Marker({ draggable: false, raiseOnDrag: false, icon: // icon path animation: google.maps.Animation.DROP, position: latlng, // google latlng coords map: // element holding your map }); markers.push(marker); }

Everything you need is available in the Google Maps API.

更多推荐

本文发布于:2023-04-21 18:29:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/dzcp/dc3e35a0e54cb0c7000290324ec9dd85.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:经度   纬度   变量   位置   Google

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!