使用iPhone位置更新谷歌地图

我正在建设一个周期信息网站，希望能够从iPhone获取用户位置，以便更新我的Google地图并向用户提供相关信息。有一个名为Geolocation的Drupal模块，它使用HTML5选项来执行此操作，并且我已经找到它在下面的模块中执行任务的代码。使用iPhone位置更新谷歌地图

// START: Autodetect clientlocation. 
      // First use browser geolocation 
      if (navigator.geolocation) { 
      browserSupportFlag = true; 
      $('#geolocation-help-' + i + ':not(.geolocation-processed)').addClass('geolocation-processed').append(Drupal.t(', or use your browser geolocation system by clicking this link') +': <span id="geolocation-client-location-' + i + '" class="geolocation-client-location">' + Drupal.t('My Location') + '</span>'); 
      // Set current user location, if available 
      $('#geolocation-client-location-' + i + ':not(.geolocation-processed)').addClass('geolocation-processed').click(function() { 
       navigator.geolocation.getCurrentPosition(function(position) { 
       latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
       Drupal.Geolocation.maps[i].setCenter(latLng); 
       Drupal.Geolocation.setMapMarker(latLng, i); 
       Drupal.Geolocation.codeLatLng(latLng, i, 'geocoder'); 
       }, function() { 
       Drupal.Geolocation.handleNoGeolocation(browserSupportFlag, i); 
       }); 
      }); 
      }

有没有人有任何Google Maps API V3的实现这个或类似的经验？我希望用户不得不点击“我的位置”或等价物，然后使用他们的iPhone位置来更新地图，而不是自动请求它。这是我的地图和我拥有的一系列标记。我如何利用iPhone的位置来更新它？

function initialize() { 

    var myOptions = { 
    zoom: 14, 
    center: new google.maps.LatLng(51.51251523, -0.133201961), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    var bikeLayer = new google.maps.BicyclingLayer(); 
    bikeLayer.setMap(map); 

    setMarkers(map, spots); 
} 


var spots = [ 

['Marylebone', 51.51811784, -0.144228881, '2.png', 2901, 'Broadcasting House - Marylebone</br>Available Bikes: 1</br>Number of Docks: 13</br> View more information about <a href="/node/2901">this dock</a>'], 


['Fitzrovia', 51.51991453, -0.136039674, '3.png', 2908, 'Scala Street - Fitzrovia</br>Available Bikes: 8</br>Number of Docks: 21</br> View more information about <a href="/node/2908">this dock</a>'], 


['Fitzrovia', 51.52351808, -0.143613641, '3.png', 2923, 'Bolsover Street - Fitzrovia</br>Available Bikes: 6</br>Number of Docks: 19</br> View more information about <a href="/node/2923">this dock</a>'], 


['Fitzrovia', 51.52025302, -0.141327271, '3.png', 2975, 'Great Titchfield Street - Fitzrovia</br>Available Bikes: 5</br>Number of Docks: 19</br> View more information about <a href="/node/2975">this dock</a>'], 


['Bloomsbury', 51.51858757, -0.132053392, '3.png', 2982, 'Bayley Street - Bloomsbury</br>Available Bikes: 12</br>Number of Docks: 25</br> View more information about <a href="/node/2982">this dock</a>'] 

]; 

function setMarkers(map, locations) { 

     var image1 = new google.maps.MarkerImage('amber-spot.png', 
     new google.maps.Size(30, 36), 
     new google.maps.Point(0,0), 
     new google.maps.Point(0, 32)); 

    var shape = { 
     coord: [1, 1, 1, 20, 18, 20, 18 , 1], 
     type: 'poly' 
    }; 
    var bounds = new google.maps.LatLngBounds(); 
    for (var i = 0; i < locations.length; i++) { 
    var spot = locations[i]; 
    var myLatLng = new google.maps.LatLng(spot[1], spot[2]); 

    var marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map, 
     icon: spot[3], 
     title: spot[0], 
     zIndex: spot[4], 
     html: spot[5] 
    }); 
    bounds.extend(myLatLng); 
    map.fitBounds(bounds); 
    var infowindow = new google.maps.InfoWindow({ 
}); 

    google.maps.event.addListener(marker, 'click', function() { 
    infowindow.setContent(this.html); 
    infowindow.open(map,this); 
}); 
    } 
}

感谢

李

来源

2012-01-17 Lee Woodman

澄清：您希望用户使用地图在您的站点上跳跃，单击显示我的位置，然后您将保存其位置，然后将地图窗口重新定位到其位置？ – 2012-01-17 19:05:15

是的，这就是迈克尔 – 2012-01-17 20:15:41