2012-02-02 21 views
0

私はこのウェブサイトでは新しく、私のウェブサイトのページにいくつかの問題があります。 私は自分のウェブサイト上でGoogleマップを表示したいが、それは正常に動作するが、タブjquery(http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min .js)を使用してコンテンツを1つずつ表示します。正しくロードされていません。 私のウェブサイトの場所地図タブの下の地図をご覧ください。リンクを以下に示します。Googleマップが完全に読み込まれていません

http://www.21flats.com/beta/property_detail/16/8/Ranikhet/Ranikhet.html

<script type="text/javascript"> 
       var lat=document.getElementById('lat').value; 
       var lon=document.getElementById('lon').value; 
       setTimeout(getlocation(lat,lon), 100); 

       function getlocation(lat,lon) 
       { 
        google.maps.event.addDomListener(window, 'load', function() { 

        var map = new google.maps.Map(document.getElementById('map'), { 
         zoom: 13, 
         center: new google.maps.LatLng(lat,lon), 
         mapTypeId: google.maps.MapTypeId.ROADMAP 
        }); 

        var infoWindow = new google.maps.InfoWindow; 

        var onMarkerClick = function() { 
         var marker = this; 
         var latLng = marker.getPosition(); 
         infoWindow.setContent('<h3>This is my project:</h3>' + 
          latLng.lat() + ', ' + latLng.lng()); 

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

        var marker1 = new google.maps.Marker({ 
         map: map, 
         position: new google.maps.LatLng(lat,lon) 
        }); 

        google.maps.event.addListener(marker1, 'click', onMarkerClick); 



        }); 
        } 
       </script> 

    <div id="map" style="width: 640px;height: 450px;border:1px solid #999999;"></div> 
    ..m using this how can i call "google.maps.event.trigger(map, 'resize')" this function in my function. 

答えて

0

私はあなたの問題はマップが隠されたdiv要素(クローズドjqueryのタブ)に位置しており、クリックする場合にのみ表示されているという事実に関連していることを良いチャンスがあると思いますタブ上に

私はこの問題を経験し、このスレッドで提案されたソリューションを使用して、それを解決した:Google map display from a hidden area

0

は自分の希望緯度&経度を変更しても、あなたの自己によってマーカー画像を置くことにより、制御するために、その簡単に、これを試してみてください。

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
     <script type="text/javascript"> 
      function initialize() { 
       var latlng = new google.maps.LatLng(25.2894045564648903, 51.49017333985673); 
       var settings = { 
        zoom: 12, 
        center: latlng, 
        mapTypeControl: true, 
        mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
        navigationControl: true, 
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}, 
        mapTypeId: google.maps.MapTypeId.ROADMAP}; 
       var map = new google.maps.Map(document.getElementById("map_canvas"), settings); 
       var contentString = '<div id="content">'+ 
        '<div id="siteNotice">'+ 
        '</div>'+ 
        '<h1 id="firstHeading" class="firstHeading">Area name</h1>'+ 
        '<div id="bodyContent">'+ 
        '<p align="left" >P.O.Box : 666666 - Dubai, UAE <br> Tel : (+971) 789789789</p>'+ 
        '</div>'+ 
        '</div>'; 
       var infowindow = new google.maps.InfoWindow({ 
        content: contentString 
       }); 
       var companyImage = new google.maps.MarkerImage('images/marker.png', 
        new google.maps.Size(100,50), 
        new google.maps.Point(0,0), 
        new google.maps.Point(50,50) 
       ); 
       var companyPos = new google.maps.LatLng(25.2894045564648903, 51.49017333985673); 
       var companyMarker = new google.maps.Marker({ 
        position: companyPos, 
        map: map, 
        icon: companyImage, 
        title:"Location Name", 
        zIndex: 3}); 

       google.maps.event.addListener(companyMarker, 'click', function() { 
        infowindow.open(map,companyMarker); 
       }); 
      } 
     </script> 

    <body onLoad="initialize()"> 
     <div id="map_canvas" style="width:400px; height:460px"></div> 
    </body> 
+0

私はこれも同じ問題を抱えています。とにかくあなたのサポートに感謝します。 –

0

文法上の間違いがありますが、私の答えには無視してください。 私の仕事は終わりました。 私はGoogleマップのための別のファイルを使用していますし、私のtab.nowのGoogleマップのクリックでそのフレームを呼び出すは非常に細かい作業です..

関連する問題