jQuery Ui マップにボタンを作成しようとしています。ユーザーがボタンをクリックすると、マップはユーザーの場所にパン (または中央) する必要があります。
私は次のコントロールを持っています
<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 オブジェクト) を送信すると、すべて正常に動作します。