Javascript 谷歌地图街道视图不工作-灰显

这些只是出现问题的几个示例页面。我对谷歌地图API不太精通，但仍然尝试在我的网站上加入

我添加了三个标签-一个显示路线图，另一个显示街景，第三个是walkscore。虽然路线图和步行评分很好，但街景却不行

但我注意到的一件奇怪的事情是，如果页面被调整大小（只是出于任何奇怪的原因），街景地图就会出现

如果有人帮我解决这个问题，我将不胜感激。

剧本

var地理编码器；
变量ws_wsid='afca921c9778417e8dc16a8236d1f079'；
var ws_address=“，”；
变量ws_宽度='100%'；
变量ws_高度='400'；
变量ws_布局='垂直'；
var ws_convert=‘true’；
var ws_transit_分数='真'；
var ws_map_modules='all'；
var address=“，”；
函数初始化（）{
var fenway=new google.maps.LatLng（，）
变量映射选项={
中心：芬威，
缩放：14，
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（“地图画布”），mapOptions）；
var contentString=''；
var infowindow=new google.maps.infowindow({
内容：contentString
});
var marker=new google.maps.marker({
位置：芬威，
地图：地图，
标题：“”
});
信息窗口。打开（地图、标记）；
google.maps.event.addListener（标记'click'，function（）{}）；
变量全景选项={
位置：芬威，
pov：{
标题：34，
投球：10
}
};
panorama=new google.maps.StreetViewPanorama（document.getElementById（'pano'），PanoramoOptions）；
地图设置树视图（全景）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

HTML

我只是想在单击特定选项卡时显示街景

CSS文件

[

---

因此，可以推断MapAPI及其脚本没有问题。问题在于CSS选项卡的处理方式。

---

感谢duncan的帮助。我将打开一个关于解决此CSS和JS问题的新问题。

感谢编辑Alfonso。事实上，由于这是我在stackoverflow上的第一篇文章，我不确定如何发布代码。**关于代码不起作用-是的，代码不会起作用，因为纬度和经度来自数据库e、 在那里，您可以添加任何纬度和经度值。**提示：-从以上两页查看源代码会有所帮助。

&sensor=true\u或\u false

-首先

true\u或\u false

不是此参数的有效值。其次，您不需要再指定传感器参数，只需删除它。还有一些添加传统的CSS/JS控制选项卡的显示/隐藏，对吗？你能把它添加到你的问题中吗？我在StreetView中发现，我必须先让div可见才能加载，然后立即隐藏。感谢duncan的回复。实际上我没有添加任何额外的CSS/JS来处理选项卡的显示或隐藏。我有imple使用Gumby（响应框架）创建这些选项卡。这两个CSS分别是Gumby.CSS和style.CSS。我将在主帖子上添加指向这些CSS的链接。您能否先激活pano选项卡，以便街景视图加载，然后在加载后使用JS将其隐藏？

<script src="https://maps.googleapis.com/maps/api/js?v=3.19&sensor=true_or_false"></script>

<script>
var geocoder;
var ws_wsid = 'afca921c9778417e8dc16a8236d1f079';
var ws_address = "<?php echo $row['address']; ?>,<?php echo $row['city']; ?>";
var ws_width = '100%';
var ws_height = '400';
var ws_layout = 'vertical';
var ws_commute = 'true';
var ws_transit_score = 'true';
var ws_map_modules = 'all';
var address = "<?php echo $row['address']; ?>,<?php echo $row['city']; ?>";

function initialize() {
    var fenway = new google.maps.LatLng( <? php echo $row['latitude']; ?> , <? php echo $row['longtitude']; ?> )
    var mapOptions = {
        center: fenway,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    var contentString = '<a class="fancybox-inline" href="#request_form_pop">Request of showing this property</a>';
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    var marker = new google.maps.Marker({
        position: fenway,
        map: map,
        title: ''

    });


    infowindow.open(map, marker);
    google.maps.event.addListener(marker, 'click', function() {});

    var panoramaOptions = {
        position: fenway,
        pov: {
            heading: 34,
            pitch: 10
        }
    };
    panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'), panoramaOptions);
    map.setStreetView(panorama);

}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

<div class="row">
        <div class="one columns"></div>

        <section class="ten columns tabs" style="margin: 20px 0;">         
            <ul class="tab-nav">
                <li class="active"><a href="#">Google Map</a></li>
                <li> <a href="#">Street View</a></li>
                <li><a href="#">Walk Score</a></li>
            </ul>
            <div class="tab-content active">
                <div id="map-canvas" style="height: 400px; border: 0.5px solid #000;">
                </div>
            </div>
           <div class="tab-content">
                <div id="pano" style="height: 400px; border: 0.5px solid #000;"></div>
            </div>
            <div class="tab-content">
                <div id="ws-walkscore-tile" style="height: 400px; border: 0.5px solid #000;"></div>
            </div>
            <script type='text/javascript' src='http://www.walkscore.com/tile/show-walkscore-tile.php'></script>            
        </section>

        <div class="one columns"></div>
</div>