Question

enter image description here 我们正在使用Google街景Api版本3作为我们的产品。当街景首次加载时，我们正面临一个问题。视图正在分割成片段/像素，当我们在谷歌地图中看到相同的视图时，它不会破坏，但虚构显示模糊效果。我们如何才能在产品中提供相同的模糊效果？点击此链接可查看中断效果：http://jsfiddle.net/godwinthaya/4wfLkc3t/

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Street View service</title>
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
function initialize() {
  var fenway = new google.maps.LatLng(42.345573, -71.098326);
  var mapOptions = {
    center: fenway,
    zoom: 14
  };
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

//marker
  var busMarker = new google.maps.Marker({
      position: fenway,
      map: map,
      icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_icon&chld=bus|FFFF00',
      title: 'Bus Stop'
  });
   var panoramaOptions = {
    position: fenway,
    pov: {
      heading: 34,
      pitch: 10
    }
  };
  var panorama = new google.maps.StreetViewPanorama(document.getElementById('map-canvas'), panoramaOptions);
    map.setStreetView(fenway);

     panorama.setPov(/** @type {google.maps.StreetViewPov} */({
    heading: 265,
    pitch: 0
  }));


   google.maps.event.addListener(busMarker, 'click', function() {
   alert("Hai");
    infowindow.open(map,busMarker);
  });


}


google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <!--<div id="map-canvas" style="width: 400px; height: 300px"></div> -->
    <div id="map-canvas" style="position:absolute;  width: 1000px; height: 600px;"></div>
  </body>
</html>

Answer 1

您是否正确调用了事件？您所问的内容很可能是API的一部分，但没有任何文档或参考来实现＆＃34;模糊效果＆＃34;。虽然，如果您正确调用所有事件，它应该为您提供默认行为。以下是不同事件的示例代码：

＆＃13;

var cafe = new google.maps.LatLng(37.869085, -122.254775);

function initialize() {

  var panoramaOptions = {
    position: cafe,
    pov: {
      heading: 270,
      pitch: 0
    },
    visible: true
  };
  var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);

  google.maps.event.addListener(panorama, 'pano_changed', function() {
      var panoCell = document.getElementById('pano_cell');
      panoCell.innerHTML = panorama.getPano();
  });

  google.maps.event.addListener(panorama, 'links_changed', function() {
      var linksTable = document.getElementById('links_table');
      while (linksTable.hasChildNodes()) {
        linksTable.removeChild(linksTable.lastChild);
      }
      var links = panorama.getLinks();
      for (var i in links) {
        var row = document.createElement('tr');
        linksTable.appendChild(row);
        var labelCell = document.createElement('td');
        labelCell.innerHTML = '<b>Link: ' + i + '</b>';
        var valueCell = document.createElement('td');
        valueCell.innerHTML = links[i].description;
        linksTable.appendChild(labelCell);
        linksTable.appendChild(valueCell);
      }
  });

  google.maps.event.addListener(panorama, 'position_changed', function() {
      var positionCell = document.getElementById('position_cell');
      positionCell.firstChild.nodeValue = panorama.getPosition() + '';
  });

  google.maps.event.addListener(panorama, 'pov_changed', function() {
      var headingCell = document.getElementById('heading_cell');
      var pitchCell = document.getElementById('pitch_cell');
      headingCell.firstChild.nodeValue = panorama.getPov().heading + '';
      pitchCell.firstChild.nodeValue = panorama.getPov().pitch + '';
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

＆＃13;

谷歌地图街景破损

1 个答案: