참고 : 나는 위치 정보 예제의 세 가지 다른 버전을 수집 한Google지도 자바 스크립트 인 GeoLocation - 크롬
http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_geolocation_map에서와 Google Maps Javascript V3 geolocation - cannot access initialLocation variable unless alerted 아래 인용하여 HTML의 원본 소스가왔다. Firefox에서 모두 제대로 작동합니다. Chrome에서는 아무 작업도 수행 할 수 없습니다. 모든 사이트에서 내 위치를 사용할 수 있도록 Chrome 권한을 설정했으나 성공하지 못했습니다. Chrome 설정이어야하지만 분명한 설정이 아니어야합니다. 설정/고급 설정 표시/개인 정보/콘텐츠 설정/위치/모든 사이트에서 내 실제 위치를 추적하도록 허용합니다.
Firefox에서 위치 공유를 요청한 후 현재 위치가 표시됩니다.
크롬에서 사용자가 Geolocation 요청을 거부하거나 오류 : Geolocation 서비스가 HTML에 따라 실패했습니다.
Firefox에서 작동하고 Chrome에서는 작동하지 않는다는 점을 감안하면 Chrome 설정이 있어야한다는 것을 알았지 만 모든 사이트에서 내 실제 위치를 추적하도록 허용하는 것보다 허용 할 수있는 일을 잘 모릅니다.
geoGoogle.html :
<!DOCTYPE html>
<html>
<head>
<title>Geolocation</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<!--
Include the maps javascript with sensor=true because this code is using a
sensor (a GPS locator) to determine the user's location.
See: https://developers.google.com/apis/maps/documentation/javascript/basics#SpecifyingSensor
-->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
// Try HTML5 geolocation
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
map.setCenter(initialLocation);
var infowindow = new google.maps.InfoWindow({
map: map,
position: initialLocation ,
content: 'Location found using W3C standard'
});
var marker = new google.maps.Marker({
position: initialLocation,
map: map
});
}, function() {
handleNoGeolocation(true);
});
} else {
// Browser doesn't support Geolocation
handleNoGeolocation(false);
}
}
function handleNoGeolocation(errorFlag) {
if (errorFlag) {
var content = 'Error: The Geolocation service failed.';
} else {
var content = 'Error: Your browser doesn\'t support geolocation.';
}
var options = {
map: map,
position: new google.maps.LatLng(60, 105),
content: content
};
var infowindow = new google.maps.InfoWindow(options);
map.setCenter(options.position);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
geoGoogle2.html :
<!DOCTYPE html>
<html>
<head>
<title>Geolocation</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<!--
Include the maps javascript with sensor=true because this code is using a
sensor (a GPS locator) to determine the user's location.
See: https://developers.google.com/apis/maps/documentation/javascript/basics#SpecifyingSensor
-->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
// Try HTML5 geolocation
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var pos = new google.maps.LatLng(position.coords.latitude,
position.coords.longitude);
var infowindow = new google.maps.InfoWindow({
map: map,
position: pos,
content: 'Location found using HTML5.'
});
map.setCenter(pos);
}, function() {
handleNoGeolocation(true);
});
} else {
// Browser doesn't support Geolocation
handleNoGeolocation(false);
}
}
function handleNoGeolocation(errorFlag) {
if (errorFlag) {
var content = 'Error: The Geolocation service failed.';
} else {
var content = 'Error: Your browser doesn\'t support geolocation.';
}
var options = {
map: map,
position: new google.maps.LatLng(60, 105),
content: content
};
var infowindow = new google.maps.InfoWindow(options);
map.setCenter(options.position);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
geoGoogle3.html :
<!DOCTYPE html>
<html>
<body>
<p id="demo">Click the button to get your position:</p>
<button onclick="getLocation()">Try It</button>
<div id="mapholder"></div>
<script>
var x=document.getElementById("demo");
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition,showError);
}
else{x.innerHTML="Geolocation is not supported by this browser.";}
}
function showPosition(position)
{
var latlon=position.coords.latitude+","+position.coords.longitude;
var img_url="http://maps.googleapis.com/maps/api/staticmap?center="
+latlon+"&zoom=14&size=400x300&sensor=false";
document.getElementById("mapholder").innerHTML="<img src='"+img_url+"'>";
}
function showError(error)
{
switch(error.code)
{
case error.PERMISSION_DENIED:
x.innerHTML="User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML="Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML="The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML="An unknown error occurred."
break;
}
}
</script>
</body>
</html>
감사
다음 세 HTML5 파일입니다
가능한 중복 작동합니다 http://stackoverflow.com/questions/6181379/w3c-geolocation-api-not-working-in-chrome) –
예, 복제본입니다. 나는 file : ///을 사용하고 있었다. David에게 감사한다. 답변 옆에 녹색 체크 표시가 없으므로 어떻게해야합니까? 질문을 삭제해야합니까? – user825628
아니, 그만둬. 코드가 누군가를 도울 가능성이 높습니다. 지역 사회가 불필요하다고 생각하면 돌보아 줄 것입니다. –