首先:我是Javascript的新手。我使用Geolocation
来获取用户位置和Geocoding
我想知道是否可以在地图上设置自己的标记,并将它们以特定的半径加载到当前位置。因此,如果我获得了用户位置,则应该显示半径范围内的标记,例如1&000; 000m。
在这里,您可以看到我如何使用Geolocation
和Geocoding
:
<div id="pos" style="width:585px; height:300px;">
Get position...
</div>
<br />
<p>Put your correct address in the input field below:<br />
</p>
<input type="text" id="address" name="address" placeholder="Type in your address" style="width:250px;" />
<input type="submit" id="submit" onclick="getValue()" value="Submit" />
<script type="text/javascript"src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
var geocoder;
var map;
function initialize(coords) {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(coords.latitude, coords.longitude);
var myOptions = {
zoom: 11,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("pos"), myOptions);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: "Your location:"
});
}
navigator.geolocation.getCurrentPosition(function(position){
initialize(position.coords);
}, function(){
document.getElementById('pos').innerHTML = 'An error occured. Refresh the page or contact the IT team!';
});
function getValue(){
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("An unknown error occured. Refresh the page or contact the IT team!" + status);
}
});
}
</script>
这很好用。我想也许我可以在一个数组中设置位置,所以每次加载页面或函数时,它都会从数组中加载位置,并以标记的形式显示每个位置超过1&m; 000m。
有办法做到这一点吗?有人可以给我一个提示吗?
谢谢