2013-07-02 2 views
8
작동하지는

참고 : 나는 위치 정보 예제의 세 가지 다른 버전을 수집 한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 파일입니다
+1

가능한 중복 작동합니다 http://stackoverflow.com/questions/6181379/w3c-geolocation-api-not-working-in-chrome) –

+0

예, 복제본입니다. 나는 file : ///을 사용하고 있었다. David에게 감사한다. 답변 옆에 녹색 체크 표시가 없으므로 어떻게해야합니까? 질문을 삭제해야합니까? – user825628

+0

아니, 그만둬. 코드가 누군가를 도울 가능성이 높습니다. 지역 사회가 불필요하다고 생각하면 돌보아 줄 것입니다. –

답변

8

Chrome 및 Safari (웹킷 브라우저)는 파일 시스템에있는 파일에 대해 Geolocation API를 허용하지 않습니다.

는 (웹 응용 프로그램을 만들고

http://localhost/geoGoogle.html 
+0

여전히 사파리에서 얻을 수 없습니다. 5.1.7 – saikiran

0

처럼 로컬 호스트에 액세스하려고 단지 HTTP 대신 HTTPS를 사용하고는 [W3C 위치 정보 API는 크롬에서 작동하지 않는]의

관련 문제