我需要將圓的中心設置爲用戶的當前位置

-1

我有以下代碼可讓用戶通過輸入框和按鈕設置圓的半徑。我需要做的是將圓的中心設置爲用戶的當前位置。任何幫助將不勝感激。我需要將圓的中心設置爲用戶的當前位置

<apex:page sidebar="false" showheader="false"> 
 
\t 
 
    <head> 
 

 
     
 
    <style type="text/css"> 
 
    html { height: 100% } 
 
    body { height: 100%; margin: 0; padding: 0 } 
 
    #map-canvas { width:100%;height:80%; } 
 
    .controls  
 
    </style> 
 
    
 

 
    <script src="https://maps.googleapis.com/maps/api/js?key=XXXXXX"></script> 
 

 

 
    <script> 
 

 

 
    var myCenter = new google.maps.LatLng(51.508742, -0.120850); 
 
    var circle; 
 

 
    function initialize() { 
 
    var mapProp = { 
 
     center: myCenter, 
 
     zoom: 15, 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }; 
 
    var map = new google.maps.Map(document.getElementById("googleMap"), mapProp); 
 
    var marker = new google.maps.Marker({ 
 
     position: myCenter, 
 
    }); 
 
    
 
    circle = new google.maps.Circle({ 
 
     map: map, 
 
     radius: 100, // 10 miles in metres 
 
     fillColor: '#AA0000', 
 
     center: myCenter 
 
    });    
 
    marker.setMap(map);  
 

 
    } 
 

 
    function updateRadius(){ 
 
    var rad = document.getElementById("value_rad").value; 
 
    circle.setRadius(parseFloat(rad)); 
 
    } 
 
    
 

 
    google.maps.event.addDomListener(window, 'load', initialize); 
 
    console.log() 
 

 
    </script> 
 
    </head> 
 
    <body> 
 
    
 
    <div id="googleMap" style="width:100%;height:80%;"></div> 
 
    <input id="value_rad" /> 
 
    <input id="radius" type="button" value="Search" onclick="updateRadius()"/> 
 
    </body> 
 
    </apex:page>

來源

2016-11-22 Lawrence

什麼你叫地理位置後，有一個很好的書面記錄在這裏：

https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/Using_geolocation

你需要獲取用戶的緯度和經度之內成功回調 navigator.geolocation.getCurrentPosition（success，error，options）;

如

function success(pos) { 
    var crd = pos.coords; 
    var myCenter = new google.maps.LatLng(crd.latitude, crd.longitude); 
    // init map and whatnot 
};

你需要做一些檢查，以確保獲取用戶的位置是允許的，也有在上面的鏈接引用。

來源

2016-11-22 12:37:02

您需要大地定位用戶（需要用戶同意分享他/她的位置）：

if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position){ 
     var latitude = position.coords.latitude; 
     var longitude = position.coords.longitude; 
     var myCenter = new google.maps.LatLng(latitude, longitude); 
    //rest of function 
    }); 
}

注 - 要做到這一點在Chrome，你將需要使用HTTPS。

來源

2016-11-22 12:37:44 sideroxylon

我需要將圓的中心設置爲用戶的當前位置

回答

相關問題