Google Maps Streetview - How to get Panorama ID

前端 未结 7 1876
轮回少年
轮回少年 2020-12-15 09:49

I want to use custom panorama position, but I need a panorama id for it. Can someone explain me how to get the panorama id from the next link:

https://www.google.nl/

相关标签:
7条回答
  • 2020-12-15 10:23

    In order to get a panorama ID (pano), I have developed a little HTML page whith which you can get some of its parameters (zoom/Pov, pitch and heading) and get the Street View Image request HTTP URL.

    Don't forget to replace the YOUR_API_KEY with your own API key (obvious)

    Have fun with google maps!!

    <!DOCTYPE html>
    <html>
    
    <head>
    <meta charset="utf-8">
    <style>
        html,
        body {
            height: 95%;
            margin: 0;
            padding: 0;
        }
    
        #map,
        #pano {
            float: left;
            height: 95%;
            width: 45%;
        }
    </style>
    </head>
    
    <body>
    <div id="tray">
        <button id="doer" onclick="doThings()">do it</button>
        <span id="resulting"></span>
    </div>
    <div id="map"></div>
    <div id="pano"></div>
    <script>
        var panorama, map;
        var APIkey= "YOUR_API_KEY"
    
        function initialize() {
            var fenway = {
                lat: 42.345573,
                lng: -71.098326
            };
            var agbar = new google.maps.LatLng(41.4035482, 2.1894355);
            map = new google.maps.Map(document.getElementById('map'), {
                center: agbar,
                zoom: 14
            });
            panorama = new google.maps.StreetViewPanorama(
                document.getElementById('pano'), {
                    position: agbar,
                    pov: {
                        heading: 34,
                        pitch: 10
                    }
                });
            map.setStreetView(panorama);
        }
    
        function doThings() {
            console.log("doing things");
            document.getElementById("resulting").innerHTML = "https://maps.googleapis.com/maps/api/streetview?size=640x640" +"&pano=" + panorama.getPano() + "&heading=" + panorama.getPov().heading + "&pitch=" + panorama.getPov().pitch + "&fov="+ (180/ (Math.pow(2, panorama.getZoom()?panorama.getZoom():1)))+ "&key=" + APIkey;
          //use the next line to open in a new tab the resulting image at max size (640x640)
            window.open("https://maps.googleapis.com/maps/api/streetview?size=640x640" + "&pano=" + panorama.getPano() + "&heading=" + panorama.getPov().heading + "&pitch=" + panorama.getPov().pitch + "&fov="+ (180/ (Math.pow(2, panorama.getZoom())))+ "&key=" +APIkey)
        }
    </script>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initialize">
    </script>
    </body>
    
    </html>
    

    Instructions: create an html file, copy the code , replace API key, open html file in browser, push the "do it" button.

    More references can be found at Google's: https://developers.google.com/maps/documentation/javascript/streetview#StreetViewPanoramas

    0 讨论(0)
  • 2020-12-15 10:24

    Google changed the format of the pano IDs with their updates in Aug/Sept. Similar to before the pano ID can be found between the !1s and !2e. So in the example posted by Jason the pano ID would be (urldecoded):

    F:-gVtvWrACv2k/Vnh0Vg8Z8YI/AAAAAAABLWA/a-AT4Wb8MD8

    In order to get it to work for us we had to prepend the F: in front of it. There is also a known bug which requires the addition of an undocumented flag to use newer panos (see https://code.google.com/p/gmaps-api-issues/issues/detail?id=7452#c51):

    google.maps.streetViewViewer = 'photosphere';
    
    0 讨论(0)
  • 2020-12-15 10:26
    1. Find the pano on Google Maps
    2. Open Developer Tools console
    3. Copy/Paste/Run the following. Result should be the pano id.

    "F:".concat(window.location.href.split("!1s")[1].split("!2e")[0]).replace('%2F','/')

    Thanks @Rgrauphics

    0 讨论(0)
  • 2020-12-15 10:27

    This does not work for photos added to Google Maps after the Sept 3rd 2015 update.

    https://www.google.com/maps/@28.4184117,-80.6076033,3a,75y,349h,88t/data=!3m8!1e1!3m6!1s-gVtvWrACv2k%2FVnh0Vg8Z8YI%2FAAAAAAABLWA%2Fa-AT4Wb8MD8!2e4!3e11!6s%2F%2Flh4.googleusercontent.com%2F-gVtvWrACv2k%2FVnh0Vg8Z8YI%2FAAAAAAABLWA%2Fa-AT4Wb8MD8%2Fw203-h101-n-k-no%2F!7i11000!8i5500

    0 讨论(0)
  • 2020-12-15 10:27

    As Justin MacLeod mentioned, but here is what I did exactly.

    You need to adjust the ID number. You can still find the ID number between the !1s and !2e but you need to update your url for it to work.

    Add F: to the start of your ID
    Change %2F in the ID to /
    

    My ID example Before:

    -3_7tAKLhLLU%2FV0nuKmxj7xI%2FAAAAAAAAdE8%2FHZYhfYoBGqAsQw-63snzF9OkIy7YT051ACLIB
    

    After:

    F:-3_7tAKLhLLU/V0nuKmxj7xI/AAAAAAAAdE8/HZYhfYoBGqAsQw-63snzF9OkIy7YT051ACLIB
    
    0 讨论(0)
  • 2020-12-15 10:31

    Got it!

    https://www.google.nl/maps/@52.239981,6.851849,3a,90y,324.71h,64.65t/data=!3m5!1e1!3m3!1sFEpIJhSgOzoAAAQJOQCL3w!2e0!3e11

    After the !1s and before the !2e is the Panorama ID, so here is it:

    FEpIJhSgOzoAAAQJOQCL3w

    0 讨论(0)
提交回复
热议问题