Плагин jQuery Mobile и Google maps в сафари четко определяет границы, но не работает в автономной версии
Я использую jQuery Mobile и плагин jQuery для карт Google, чтобы получить маршрут от А до Б, это прекрасно работает в сафари на iPhone, но когда я делаю его в автономной версии (т.е. добавляю на мой домашний экран), карта после того, как она была воспроизведена, имеет два маркера и маршрут, но он не увеличен до границ маркеров, как в сафари. Если я запускаю domap() по нажатию кнопки, он отлично работает в автономной версии. Как получить масштабирование до границ в версии dtandalone при загрузке страницы?
HTML
<div id="map_canvas" style="height:250px;width:100%;"></div>
<div data-role="content" style="padding-top:0;">
<a href="#" id="domap" data-icon="refresh" data-iconpos="notext" data-role="button" style="float:right;">reset map</a><br clear="all" />
<div data-role="collapsible" data-theme="a" data-content-theme="c" data-collapsed="false">
<h3>Directions</h3>
<p id="directions"></p>
</div>
</div>
код JQuery
$('#map').live("pagecreate", function() {
domap();
});
$('#domap').click(function() {
domap();
});
function domap(){
var mobileMap = { 'center': '50.873422,0.011096'};
$('#map_canvas').gmap('getCurrentPosition', function(position, status) {
if ( status === 'OK' ) {
var clientPosition = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
var destination = new google.maps.LatLng('50.873422','0.011096');
$('#map_canvas').gmap('displayDirections', {
'origin': clientPosition,
'destination': destination,
'travelMode': google.maps.DirectionsTravelMode.DRIVING }, {
'panel': document.getElementById('directions')
}, function(success, response) {
if ( !success ) {
$('#map_canvas').gmap('getService', 'DirectionsRenderer').setMap(null);
}
});
}
});
}
1 ответ
Я не знаком с плагином Google Maps jQuery, но со стандартным API вам нужно создать LatLngBounds()
объект и использование .fitBounds()
на карте объекта.
Автор сценария:
var bounds = new google.maps.LatLngBounds(),
map = new google.maps.Map( mapCanvas, options ); //your map object here
bounds.extend( clientPosition );
bounds.extend( destination );
map.fitBounds( bounds );