1

場所が表示されているページがあります。そこには 2 つのタブがあり、1 つはグーグマップ用、もう 1 つは天気用です。

たとえば、この場所http://www.places4two.de/location/date-in-mozart-stuben/45/

しかし、天気タブに切り替えると、タブが完全にロードされていないことがわかります。天気タブを最初にアクティブにすると、Googlemaps タブが完全に読み込まれません。

ここで何が間違っていますか?

これはコードです:

  $('#myTab a').click(function (e) {
     e.preventDefault();
     $(this).tab('show');
  });

html

<div style="padding-left: 75px">
  <ul class="nav nav-tabs" id="myTab">
    <li class="active"><a href="#lage">Lage</a></li>
    <li><a href="#wetter">Wetter</a></li>
  </ul>
</div> 
<div class="tab-content">
  <div class="tab-pane active" id="lage">
     <div id="map-canvas" style="max-width: 1100px; height: 350px"> </div>
  </div>
  <div class="tab-pane" id="wetter">
     <div id="basicMap" style="max-width: 1100px; height: 350px"> </div>    
  </div>                  
</div>

助けてくれてどうもありがとう

4

2 に答える 2

0
    $('a[href="#lage"]').on('shown', function(e) {
        google.maps.event.trigger(map, 'resize');
    });

    $('#myTab a[href="#lage"]').on('shown', function(){
        google.maps.event.trigger(map, 'resize');
        map.setCenter(latlng);
    });

タブで呼び出すときは、マップのサイズを変更する必要があります。

于 2013-10-12T10:06:45.477 に答える