Mootools breaks Google maps streetview - black screen

蹲街弑〆低调 提交于 2021-01-29 04:04:46

问题


Including the mootools.min.js in the Maps JavaScript API Hello World example causes the street view feature to fail rendering street images. I'm working with Joomla and mootools gets loaded prior to my code getting inserted.

I reduced the problem until I was working with the HelloWorld example provided in the documentation. My local version of mootools is 1.4.5. I've tested it with the hosted 1.45 as well as the latest version 1.6.0.

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/mootools/1.6.0/mootools.min.js"></script>

    <style>
      /* Always set the map height explicitly to define the size of the div
       * element that contains the map. */
      #map {
        height: 100%;
      }
      /* Optional: Makes the sample page fill the window. */
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_HERE&callback=initMap"
    async defer></script>
  </body>
</html>

After dropping the street view man onto the street network I see two console errors:

GET about:invalid net::ERR_UNKNOWN_URL_SCHEME

GET https://example.com/%5Bobject%20Array%20Iterator%5D?panoid=hDKgn2F54H80bzAQMu1LoQ&output=tile&x=0&y=0&zoom=0&nbt&fover=2 404 (Not Found)

The street view interface seems to be working - the nav arrows are displayed and clickable, just no images.

来源:https://stackoverflow.com/questions/57084724/mootools-breaks-google-maps-streetview-black-screen

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!