Ich machte eine Funktion, die nächstgelegenen Hotels in Google map.my Code angezeigt wird wie folgt.Setzen Sie Marker in der Callback-Funktion, wo die Position des Benutzers nach dem Erstellen der Karte verfügbar ist
var map;
function initMap() {
var latlng = new google.maps.LatLng(28.535516,77.391026);
if (navigator.geolocation) {
try {
navigator.geolocation.getCurrentPosition(function(position) {
var myLocation = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
setPos(myLocation);
});
} catch (err) {
var myLocation = {
lat: 25.2048,
lng: 55.2708
};
setPos(myLocation);
}
} else {
var myLocation = {
lat: 25.2048,
lng: 55.2708
};
setPos(myLocation);
}
}
function setPos(myLocation) {
map = new google.maps.Map(document.getElementById('map'), {
center: myLocation,
zoom: 10
});
var service = new google.maps.places.PlacesService(map);
service.nearbySearch({
location: myLocation,
radius: 4000,
types: ['hotels']
}, processResults);
}
function processResults(results, status, pagination) {
if (status !== google.maps.places.PlacesServiceStatus.OK) {
return;
} else {
createMarkers(results);
}
}
function createMarkers(places) {
var bounds = new google.maps.LatLngBounds();
var placesList = document.getElementById('places');
for (var i = 0, place; place = places[i]; i++)
{
var image = {
url: place.icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(25, 25)
};
var marker = new google.maps.Marker({
map: map,
icon: image,
title: place.name,
animation: google.maps.Animation.DROP,
position: place.geometry.location
});
bounds.extend(place.geometry.location);
}
map.fitBounds(bounds);
}
html,body {
margin: 0;
padding: 0;
}
#map {
height: 500px;
margin: 10px auto;
width: 800px;
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBuBzeYkYimIquGG5KkIcB6vFmtHMUzDFo&libraries=places&callback=initMap" async defer></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBuBzeYkYimIquGG5KkIcB6vFmtHMUzDFo&libraries=places"></script>
<div id="map"></div>
obige Beispiel gibt mir am nächsten Hotels um Benutzer Lage. aber ich will Anzeige auch Benutzer Ortszeiger. So wie kann ich zeigen Benutzer Standort hier.
ich auch versuchen, durch das Hinzufügen in initMap()
benutzerdefinierte Funktion zu zeigen, Benutzer Marker aber es OVERRIDE mit Hotels Symbole. Wenn ich die Seite zuerst für Mikrosekunden aktualisiere, wird der Benutzerstandort angezeigt und das Hotels-Symbol überschreibt das. hier ist mein Bild mit o/p von oben Code.
Wie haben Sie versuchen, die Position des Benutzers zu zeigen? Bitte geben Sie eine [mcve] an, die Ihr Problem anzeigt. – geocodezip
Ich platziere den Code beim Start der Funktion. Zuerst bekomme ich den Benutzer lat lang und setze den Marker dort beim Start der 'initMap()' Funktion. –
Bearbeiten Sie Ihre Frage zu zeigen, was Sie meinen. Die Geolocation-Funktionalität ist asynchron, Sie müssen diese Markierung in der Callback-Funktion setzen, wo/wann die Position des Benutzers verfügbar ist (und nach dem Erstellen der Karte ...) – geocodezip