必備條件：
一、瀏覽器支持定位
瀏覽器定位插件，封裝了標準HTML5定位，並且包含糾偏模塊。
由於核心是HTML5定位，所以瀏覽器定位插件僅適用於支持HTML5的瀏覽器上，比如，Internet Explorer 9、Firefox、Chrome、Safari 以及 Opera 等。同時，需要瀏覽器允許該服務進行定位。如下圖：
另外，瀏覽器定位插件也是混合定位，獲取了wifi、基站信息用以定位，對於擁有 GPS 的設備，比如 iPhone，由於獲得GPS信息，使得地理定位更加精確。
瀏覽器定位，最好使用在手機瀏覽器上，因爲手機上植入了GPS模塊，定位會更加準確，也更加符合使用場景。PC瀏覽器上，建議使用IP定位。
定位代碼：（此代碼已經將定位產生的背景爲淡藍色的的圓形區域去掉）
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>瀏覽器定位</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申請的key值"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<body>
<div id='container'></div>
<div id="tip"></div>
<script type="text/javascript">
var map, geolocation;
//加載地圖，調用瀏覽器定位服務
map = new AMap.Map('container', {
resizeEnable: true
});
map.plugin('AMap.Geolocation', function() {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默認:true
timeout: 10000, //超過10秒後停止定位，默認：無窮大
maximumAge: 0, //定位結果緩存0毫秒，默認：0
convert: true, //自動偏移座標，偏移後的座標爲高德座標，默認：true
showButton: true, //顯示定位按鈕，默認：true
buttonPosition: 'LB', //定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20),//定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: true, //定位成功後在定位到的位置顯示點標記，默認：true
showCircle: false, //定位成功後用圓圈表示定位精度範圍，默認：true （去掉圓形區域）
panToLocation: true, //定位成功後將定位到的位置作爲地圖中心點，默認：true
zoomToAccuracy:true //定位成功後調整地圖視野範圍使定位位置及精度範圍視野內可見，默認：false
});
map.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出錯信息
});
//解析定位結果
function onComplete(data) {
var str=['定位成功'];
str.push('經度：' + data.position.getLng());
str.push('緯度：' + data.position.getLat());
str.push('精度：' + data.accuracy + ' 米');
str.push('是否經過偏移：' + (data.isConverted ? '是' : '否'));
document.getElementById('tip').innerHTML = str.join('<br>');
}
//解析定位錯誤信息
function onError(data) {
document.getElementById('tip').innerHTML = '定位失敗';
}
</script>
</body>
</html>
二、應用瀏覽器定位，以當前定位點爲中心點自動畫一個半徑1000米的圓形區域
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>以瀏覽器定位點爲圓心畫圓</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申請的key值"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<body>
<div id='container'></div>
<div id="tip"></div>
<script type="text/javascript">
var map, geolocation;
var editor={};
//加載地圖，調用瀏覽器定位服務
map = new AMap.Map('rightBox', {
resizeEnable: true
});
map.plugin('AMap.Geolocation', function() {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默認:true
timeout: 10000, //超過10秒後停止定位，默認：無窮大
maximumAge: 0, //定位結果緩存0毫秒，默認：0
convert: true, //自動偏移座標，偏移後的座標爲高德座標，默認：true
showButton: true, //顯示定位按鈕，默認：true
buttonPosition: 'LB', //定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20),//定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: true, //定位成功後在定位到的位置顯示點標記，默認：true
showCircle: false, //定位成功後用圓圈表示定位精度範圍，默認：true
panToLocation: true, //定位成功後將定位到的位置作爲地圖中心點，默認：true
zoomToAccuracy:true //定位成功後調整地圖視野範圍使定位位置及精度範圍視野內可見，默認：false
});
map.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出錯信息
});
//解析定位結果
function onComplete(data) {
var str=['定位成功'];
str.push('經度：' + data.position.getLng());
str.push('緯度：' + data.position.getLat());
str.push('精度：' + data.accuracy + ' 米');
str.push('是否經過偏移：' + (data.isConverted ? '是' : '否'));
document.getElementById('tip').innerHTML = str.join('<br>');
//定位圓心位置
editor._circle=(function(){
var circle = new AMap.Circle({
center: [data.position.getLng(), data.position.getLat()],// 圓心位置
radius: 1000, //半徑
strokeColor: "#F33", //線顏色
strokeOpacity: 1, //線透明度
strokeWeight: 3, //線粗細度
fillColor: "#ee2200", //填充顏色
fillOpacity: 0.35//填充透明度
});
circle.setMap(map);
return circle;
})();
map.setFitView();
}
//解析定位錯誤信息
function onError(data) {
document.getElementById('tip').innerHTML = '定位失敗';
}
</script>
</body>
一、瀏覽器支持定位
瀏覽器定位插件，封裝了標準HTML5定位，並且包含糾偏模塊。
由於核心是HTML5定位，所以瀏覽器定位插件僅適用於支持HTML5的瀏覽器上，比如，Internet Explorer 9、Firefox、Chrome、Safari 以及 Opera 等。同時，需要瀏覽器允許該服務進行定位。如下圖：
另外，瀏覽器定位插件也是混合定位，獲取了wifi、基站信息用以定位，對於擁有 GPS 的設備，比如 iPhone，由於獲得GPS信息，使得地理定位更加精確。
瀏覽器定位，最好使用在手機瀏覽器上，因爲手機上植入了GPS模塊，定位會更加準確，也更加符合使用場景。PC瀏覽器上，建議使用IP定位。
定位代碼：（此代碼已經將定位產生的背景爲淡藍色的的圓形區域去掉）
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>瀏覽器定位</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申請的key值"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<body>
<div id='container'></div>
<div id="tip"></div>
<script type="text/javascript">
var map, geolocation;
//加載地圖，調用瀏覽器定位服務
map = new AMap.Map('container', {
resizeEnable: true
});
map.plugin('AMap.Geolocation', function() {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默認:true
timeout: 10000, //超過10秒後停止定位，默認：無窮大
maximumAge: 0, //定位結果緩存0毫秒，默認：0
convert: true, //自動偏移座標，偏移後的座標爲高德座標，默認：true
showButton: true, //顯示定位按鈕，默認：true
buttonPosition: 'LB', //定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20),//定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: true, //定位成功後在定位到的位置顯示點標記，默認：true
showCircle: false, //定位成功後用圓圈表示定位精度範圍，默認：true （去掉圓形區域）
panToLocation: true, //定位成功後將定位到的位置作爲地圖中心點，默認：true
zoomToAccuracy:true //定位成功後調整地圖視野範圍使定位位置及精度範圍視野內可見，默認：false
});
map.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出錯信息
});
//解析定位結果
function onComplete(data) {
var str=['定位成功'];
str.push('經度：' + data.position.getLng());
str.push('緯度：' + data.position.getLat());
str.push('精度：' + data.accuracy + ' 米');
str.push('是否經過偏移：' + (data.isConverted ? '是' : '否'));
document.getElementById('tip').innerHTML = str.join('<br>');
}
//解析定位錯誤信息
function onError(data) {
document.getElementById('tip').innerHTML = '定位失敗';
}
</script>
</body>
</html>
二、應用瀏覽器定位，以當前定位點爲中心點自動畫一個半徑1000米的圓形區域
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>以瀏覽器定位點爲圓心畫圓</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申請的key值"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<body>
<div id='container'></div>
<div id="tip"></div>
<script type="text/javascript">
var map, geolocation;
var editor={};
//加載地圖，調用瀏覽器定位服務
map = new AMap.Map('rightBox', {
resizeEnable: true
});
map.plugin('AMap.Geolocation', function() {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默認:true
timeout: 10000, //超過10秒後停止定位，默認：無窮大
maximumAge: 0, //定位結果緩存0毫秒，默認：0
convert: true, //自動偏移座標，偏移後的座標爲高德座標，默認：true
showButton: true, //顯示定位按鈕，默認：true
buttonPosition: 'LB', //定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20),//定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: true, //定位成功後在定位到的位置顯示點標記，默認：true
showCircle: false, //定位成功後用圓圈表示定位精度範圍，默認：true
panToLocation: true, //定位成功後將定位到的位置作爲地圖中心點，默認：true
zoomToAccuracy:true //定位成功後調整地圖視野範圍使定位位置及精度範圍視野內可見，默認：false
});
map.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出錯信息
});
//解析定位結果
function onComplete(data) {
var str=['定位成功'];
str.push('經度：' + data.position.getLng());
str.push('緯度：' + data.position.getLat());
str.push('精度：' + data.accuracy + ' 米');
str.push('是否經過偏移：' + (data.isConverted ? '是' : '否'));
document.getElementById('tip').innerHTML = str.join('<br>');
//定位圓心位置
editor._circle=(function(){
var circle = new AMap.Circle({
center: [data.position.getLng(), data.position.getLat()],// 圓心位置
radius: 1000, //半徑
strokeColor: "#F33", //線顏色
strokeOpacity: 1, //線透明度
strokeWeight: 3, //線粗細度
fillColor: "#ee2200", //填充顏色
fillOpacity: 0.35//填充透明度
});
circle.setMap(map);
return circle;
})();
map.setFitView();
}
//解析定位錯誤信息
function onError(data) {
document.getElementById('tip').innerHTML = '定位失敗';
}
</script>
</body>
</html>
最核心的參數是： showCircle: false, //定位成功後用圓圈表示定位精度範圍，默認：true；將默認值改爲：false即可。。。很簡單了。。望採納！。。。
可參考鏈接：http://lbs.amap.com/api/javascript-api/reference/plugin/#m_AMap.Geolocation
以下是效果圖：
