Gmaps.js \根據用戶所在位置創建一個新標記

Question

我正在使用gmaps.js進行Google地圖API。目標是創建具有用戶地理位置的地圖並創建新的標記。像「嗨！你在這裏！」

地圖和地理位置工作正常，但用當前用戶座標創建新標記成爲我的一個問題。

這是代碼：

// public/core.js 
//Creating map 
var map; 
$(document).ready(function(){ 
     map = new GMaps({ 
     el: '#map', 
     lat: 0, 
     lng: 0, 
     zoomControl : true, 
     zoomControlOpt: { 
      style : 'SMALL', 
      position: 'TOP_LEFT' 
     }, 
     panControl : false, 
     streetViewControl : false, 
     mapTypeControl: false, 
     overviewMapControl: false 
     }); 

// Define user location 
     GMaps.geolocate({ 
      success: function(position) { 
      map.setCenter(position.coords.latitude, position.coords.longitude); 
      }, 
      error: function(error) { 
      alert('Geolocation failed: '+error.message); 
      }, 
      not_supported: function() { 
      alert("Your browser does not support geolocation"); 
      } 
     }); 

// Creating marker of user location 
     map.addMarker({ 
      lat: position.coords.latitude, 
      lng: position.coords.longitude, 
      title: 'Lima', 
      click: function(e) { 
      alert('You clicked in this marker'); 
      }, 
      infoWindow: { 
       content: '<p>You are here!</p>' 
      } 
    }); 

}); 

Answer 1

的問題是，你要map.addMarker調用假定，上面的功能，GMaps.geolocate，成功的時候，其實position將只設置一次success函數解析：

// public/core.js 
//Creating map 
var map; 
$(document).ready(function(){ 
     map = new GMaps({ 
     el: '#map', 
     lat: 0, 
     lng: 0, 
     zoomControl : true, 
     zoomControlOpt: { 
      style : 'SMALL', 
      position: 'TOP_LEFT' 
     }, 
     panControl : false, 
     streetViewControl : false, 
     mapTypeControl: false, 
     overviewMapControl: false 
     }); 

// Define user location 
     GMaps.geolocate({ 
      success: function(position) { 
      map.setCenter(position.coords.latitude, position.coords.longitude); 


     // Creating marker of user location 
       map.addMarker({ 
        lat: position.coords.latitude, 
        lng: position.coords.longitude, 
        title: 'Lima', 
        click: function(e) { 
        alert('You clicked in this marker'); 
        }, 
        infoWindow: { 
         content: '<p>You are here!</p>' 
        } 
      }); 
      }, 
      error: function(error) { 
      alert('Geolocation failed: '+error.message); 
      }, 
      not_supported: function() { 
      alert("Your browser does not support geolocation"); 
      } 
     }); 

});