Ik “heb deze voorbeeldcode die gebruikmaakt van Google Maps en Google Street View ….
<html> <head> <meta charset="utf-8"> <title>Set Pegman position programmatically</title> <style> html, body { height: 100%; margin: 0; padding: 0; } #google_map, #google_streetview { float: left; height: 50%; width: 50%; } </style> </head> <body> <!-- ### The page structure ... --> <div> <form onsubmit="return false;"> Lat: <input type="text" /> Lon: <input type="text" /> <input type="submit" onclick="getLatLon();" /> </form> <script> function getlatLon() { var lat = document.getElementById("lat").value; var lon = document.getElementById("lon").value; } </script> </div> <div></div> <div></div> <script> function initialize() { //### The original pegman position ... var pegman_position = {lat: 42.345573, lng: -71.098326}; var marker; //### Add Google Map ... var google_map = new google.maps.Map(document.getElementById("google_map"), { center: pegman_position, zoom: 14 }); //### Add Google Street View ... var panorama = new google.maps.StreetViewPanorama( document.getElementById("google_streetview"), { position: pegman_position, pov: { heading: 34, pitch: 10 } }); google_map.setStreetView(panorama); panorama.addListener("position_changed", function(){ var latLon = { lat: panorama.getPosition().lat(), lng: panorama.getPosition().lng() }; }); } </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=<PUT_YOUR_API_KEY_HERE>&callback=initialize"> </script> </body> </html>
(OPMERKING: als u “het wilt uitvoeren” moet u uw Google API-sleutel onderaan de code plaatsen …)
Ik zou iets willen wijzigen de lat / lon-coördinatenwaarden in de twee specifieke invoerwaarden (deze code is een simulatie van mijn echte behoeften …), en om te zien dat de pegman beweegt op de Google Map en de afbeelding van de uitgerekte weergave zelf updatet.
Suggesties / voorbeelden?
Reacties
- Je hebt POV nodig " Het StreetViewPov-object is het meest vaak gebruikt om het gezichtspunt van de Street View-camera te bepalen. U kunt ook het standpunt van de fotograaf bepalen " developers.google.com/maps/documentation/javascript/streetview
Antwoord
Alsjeblieft. https://jsfiddle.net/35rpw0jv/
En zo centreer je de Pegman (en de kaart) op elke straatweergave verplaatsen (positiewijziging).
panorama.addListener("position_changed", function(){ map.setCenter(panorama.getPosition()); });
Reacties
- ja POV is belangrijk met pegman