简体   繁体   English

网站上的google-maps api无法获取当前位置

[英]Can't get the current location with google-maps api on a website

i'm a bit new to google maps api, what i want to achieve is to integrate a map to my website and to get my current position. 我对Google Maps api有点陌生,我想要实现的是将地图集成到我的网站并获得当前位置。 I followed some tutorials and i saw to demos, everything was fine and it's working and i get my current localisation. 我遵循了一些教程,并观看了演示,一切都很好,并且一切正常,并且得到了当前的本地化版本。

http://www.html5-css3.fr/demo/exemple-geolocalisation-html5-api-google-maps http://www.astuces-webmaster.ch/page/geoloc-html5-google-maps http://www.html5-css3.fr/demo/exemple-geolocalisation-html5-api-google-maps http://www.astuces-webmaster.ch/page/geoloc-html5-google-maps

But the problem is when i write my own and when i want to see it in the navigator, i don't get my localisation. 但是问题是当我自己编写自己的代码并且想在导航器中查看它时,我没有本地化。 I thought i didn't have the authorization to get the location, so i've changed it in the navigator parameters. 我以为我没有获得该位置的授权,所以我已经在导航器参数中对其进行了更改。 I think the problem is when i run a page which is in local in my hard drive,i am blocked. 我认为问题是当我运行硬盘中本地的页面时,我被阻止了。 i get this message "tracking your location has been blocked for this page" 我收到此消息“此页面无法跟踪您的位置” 在此处输入图片说明

This is my code : 这是我的代码:

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  <style type="text/css">
    html { height: 100% }
    body { height: 100%; margin: 0px; padding: 0px }
    #map_canvas { height: 100% ; width:100%;}
  </style>
  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script> 
  <script type="text/javascript">

    var previousPosition = null;

    function initialize() {
      map = new google.maps.Map(document.getElementById("map_canvas"), {
            zoom: 19,
            center: new google.maps.LatLng(48.858565, 2.347198),
            mapTypeId: google.maps.MapTypeId.ROADMAP
          });   
    }

    if (navigator.geolocation)
      var watchId = navigator.geolocation.watchPosition(successCallback, null, {enableHighAccuracy:true});
    else
      alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");

    function successCallback(position){
      map.panTo(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
      var marker = new google.maps.Marker({
        position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 
        map: map
      });  
      if (previousPosition){
        var newLineCoordinates = [
           new google.maps.LatLng(previousPosition.coords.latitude, previousPosition.coords.longitude),
           new google.maps.LatLng(position.coords.latitude, position.coords.longitude)];

        var newLine = new google.maps.Polyline({
          path: newLineCoordinates,        
          strokeColor: "#FF0000",
          strokeOpacity: 1.0,
          strokeWeight: 2
        });
        newLine.setMap(map);
      }
      previousPosition = position;
    };    
  </script>
</head>

<body onload="initialize()">
  <div id="map_canvas"></div>
</body>

</html>

It looks like you previously set your browser to deny sharing your location. 好像您之前将浏览器设置为拒绝共享位置。 Click the icon showing geolocation is denied and try to enable it. 单击显示拒绝地理位置的图标,然后尝试启用它。 If not possible, try restarting your browser. 如果不可能,请尝试重新启动浏览器。

Worst case is try it in a different browser (geolocation from a file:/// URL can be prohibitive on Chrome). 最糟糕的情况是,请在其他浏览器中尝试(在file:/// URL中进行地理位置定位在Chrome浏览器上是禁止的)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM