Javascript 如何将谷歌地图信息窗口更改为地理位置标记
我跟随谷歌的教程,这样我就可以在地图上显示用户的位置。它当前看起来是这样的,带有一个信息窗口:Javascript 如何将谷歌地图信息窗口更改为地理位置标记,javascript,google-maps,Javascript,Google Maps,我跟随谷歌的教程,这样我就可以在地图上显示用户的位置。它当前看起来是这样的,带有一个信息窗口: 但是,我希望显示地理位置标记,而不是信息窗口: 这是我的密码: function initialize() { var mapOptions = { center: new google.maps.LatLng(52.520008, 13.404954) }; infoWindow = new google.maps.InfoWindow;
但是,我希望显示地理位置标记,而不是信息窗口:
这是我的密码:
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(52.520008, 13.404954)
};
infoWindow = new google.maps.InfoWindow;
map = new google.maps.Map(document.getElementById("map"), mapOptions);
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var pos = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
infoWindow.setPosition(pos);
infoWindow.setContent('Location found.');
infoWindow.open(map);
map.setCenter(pos);
}, function() {
handleLocationError(true, infoWindow, map.getCenter());
});
} else {
// Browser doesn't support Geolocation
handleLocationError(false, infoWindow, map.getCenter());
}
}
function handleLocationError(browserHasGeolocation, infoWindow, pos) {
infoWindow.setPosition(pos);
infoWindow.setContent(browserHasGeolocation ?
'Error: The Geolocation service failed.' :
'Error: Your browser doesn\'t support geolocation.');
infoWindow.open(map);
}
关于如何将其从信息窗口更改为地理位置标记的任何帮助都将非常有用。提前感谢。要在谷歌地图中显示带有标记的位置,您可以尝试以下操作:
var map = new google.maps.Map(document.getElementById("map"), {
center: {lat: 52.520008, lng: 13.404954},
zoom: 8,
mapTypeId: 'roadmap'
});
var marker = new google.maps.Marker({
position: new google.maps.LatLng(52.520008, 13.404954),
map: map,
/*if you want to custom marker icon, you can set icon path here*/
icon: 'your_icon_url',
/* if you don't want to enable dragging, just remove this property */
draggable: true
});
// if you enable dragging, you can initialize this event
// to get latitude, longitude and address
google.maps.event.addListener(marker, 'dragend', function (marker) {
var latLng = marker.latLng;
var currentLatitude = latLng.lat();
var currentLongitude = latLng.lng();
var geocoder = new google.maps.Geocoder;
var latlng = { lat: currentLatitude, lng: currentLongitude };
geocoder.geocode({ 'location': latlng }, function (results, status) {
if (status === 'OK') {
// address
console.log(results);
} else {
console.log('Geocoder failed due to: ' + status);
}
});
});
注意:要使用Google地图中的位置,您需要在url中要求libraries=places
作为参数:
https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places
参考:有关谷歌设计的更多标记图标,请参见此处:相关问题:您需要在
getCurrentPosition
回调中创建标记。API中没有现成的地理位置标记。您可以创建一个。如果您还想获得设备定向,则需要自己实现。也许会有帮助。