Управление картой пользовательского интерфейса jQuery Click

Я пытаюсь создать кнопку на карте пользовательского интерфейса jQuery, когда пользователь нажимает кнопку, карта должна перемещаться (или центрироваться) в местоположении пользователя.

У меня есть следующий контроль

<div id="userLocate" style="margin:15px 15px 15px 20px;padding:5px 5px 5px 10px;"><img src="img/locate.png"></div>

И этот JS

        $('#map_canvas').gmap().bind('init', function() {   

            //Set click event on userLocationControl
            $('#userLocate').click(function(event) {
                var lat = newPoint.lat();
                var lng = newPoint.lng();
                var np = new google.maps.LatLng(lat, lng);
                console.log("lat: " + lat + " lng: "+ lng);
                $('#map_canvas').gmap('get', 'map').panTo(np);
                console.log("lat: " + np.lat() + " lng: "+ np.lng());
                $('#map_canvas').gmap('option', 'zoom', 15);
            });
            //Add userLocationControl
            $('#map_canvas').gmap('addControl', 'userLocate', google.maps.ControlPosition.RIGHT_BOTTOM);    
        });

Когда кнопка нажата, я вижу, что журнал записывает правильную широту и долготу до и после вызова метода panTo, однако карта панорамируется до позиции 0,0. Я пробовал использовать метод setCenter и получил тот же результат

Если вызвать метод вне функции щелчка и отправить ему переменную newPoint (которая является объектом LatLng), все работает нормально.