リーフレットを使用してユーザーを特定する方法はありますか？

Question

私は、ユーザーを見つけ、リーフレットでこの位置にマップを設定しようとしている：

<script> 
    var map; 

    function initMap(){ 
     map = new L.Map('map',{zoomControl : false}); 
     var osmUrl = 'http://{s}.tile.openstreetmap.org/mapnik_tiles/{z}/{x}/{y}.png', 
      osmAttribution = 'Map data &copy; 2012 OpenStreetMap contributors', 
      osm = new L.TileLayer(osmUrl, {maxZoom: 18, attribution: osmAttribution}); 
     map.setView(new L.LatLng(51.930156,7.189230), 7).addLayer(osm); 
    } 

    function locateUser(){ 
     map.locate({setView : true}); 
    } 
</script> 

には、ブラウザの許可を求める実行が、その後何も起こりませんか？私のコードに何が問題なのですか？

Answer 1

マップ変数のスコープに問題があります。 http://jsfiddle.net/XwbsU/3/

[Find me！]をクリックすると、ブラウザのジオロケーションポップアップが表示されます。

お役に立てば幸いです。

Answer 2

ここでは簡単なハッキングがあります。私はこのプラグインをお勧めしますhttps://github.com/domoritz/leaflet-locatecontrol

var loadMap = function (id) { 
    var HELSINKI = [60.1708, 24.9375]; 
    var map = L.map(id); 
    var tile_url = 'http://{s}.tile.osm.org/{z}/{x}/{y}.png'; 
    var layer = L.tileLayer(tile_url, { 
     attribution: 'OSM' 
    }); 
    map.addLayer(layer); 
    map.setView(HELSINKI, 19); 

    map.locate({setView: true, watch: true}) /* This will return map so you can do chaining */ 
     .on('locationfound', function(e){ 
      var marker = L.marker([e.latitude, e.longitude]).bindPopup('Your are here :)'); 
      var circle = L.circle([e.latitude, e.longitude], e.accuracy/2, { 
       weight: 1, 
       color: 'blue', 
       fillColor: '#cacaca', 
       fillOpacity: 0.2 
      }); 
      map.addLayer(marker); 
      map.addLayer(circle); 
     }) 
     .on('locationerror', function(e){ 
      console.log(e); 
      alert("Location access denied."); 
     }); 
}; 

loadMap('map');