Google Maps V3 StreetView не отображается при втором вызове setVisible () - PullRequest
0 голосов
/ 24 июля 2010

РЕДАКТИРОВАТЬ: Слышал от Google, они подтвердили, что это проблема с их стороны.

РЕДАКТИРОВАТЬ2: мой контакт в Google сообщил мне, что они исправили эту ошибку.

У меня неприятная ошибка при использовании Google Maps V3 API.

Если вы настраиваете карту, переключаетесь на просмотр улиц, закрываете просмотр улиц, а затем снова открываете, изображения отображаются пустыми (хотя элементы управления все еще отображаются). Если вы нажмете на элементы управления, чтобы переместить камеру, изображение вернется.

Что вызывает это? Как вы можете видеть, приведенный ниже код очень прост, я не могу понять, где я ошибся.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
  <head>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
  </head>
  <body>
    <div id="map" style="width:500px;height:300px"></div>

    <script type="text/javascript">
      var map = new google.maps.Map(document.getElementById('map'), {
        center: new google.maps.LatLng(37.767063, -122.445724),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 15
      });

      var streetView = map.getStreetView();
      streetView.setPosition(map.getCenter());

      setTimeout(function() { streetView.setVisible(true); }, 1500);
      setTimeout(function() { streetView.setVisible(false); }, 3000);
      setTimeout(function() { streetView.setVisible(true); }, 4500);
    </script>
  </body>
</html>

1 Ответ

0 голосов
/ 01 августа 2010

Я нашел такую ​​же досадную ошибку и разработал обходной путь с дополнительным div и немного CSS.Присвойте streetView # street

<div id="map" style="width:500px;height:300px;display:block"></div>
<div id="street" style="width:500px;height:300px;display:none"></div>

Добавьте функцию для переключения видимости div:

function toggleStreetView() {
  var mapDiv    = document.getElementById('map');
  var streetDiv = document.getElementById('street');

  var streetVisible = (streetDiv.style.display == 'block');
  if (streetVisible) {
    // hide streetView, show map
    streetDiv.display = 'none';
    mapDiv.display    = 'block';
  } else {
    // vice versa
    mapDiv.display    = 'none';
    streetDiv.display = 'block';
    streetView.setVisible(true); /* order important, show after div is visible */
  }      
}

Возможно, не самое элегантное решение - но оно работает.С абсолютным позиционированием CSS и фреймворком JavaScript, я предпочитаю jQuery, вы можете добавить хороший эффект затухания.

...