Плагин 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 );
Другие вопросы по тегам