Google मानचित्र केवल आंशिक रूप से

Question

दिखाता है Google मानचित्र I केवल आंशिक रूप से प्रस्तुत किया जा रहा है और गलत बिंदु पर केंद्रित है (इसे मार्कर पर केंद्रित होना चाहिए)। नीचे देखें:

अब थोड़ा और विस्तार जोड़ने के लिए:

• यह आईई
• यह एफएफ और क्रोम में स्क्रीनशॉट में की तरह दिखता है में ठीक काम करता है।
• क्रोम IST में जैसे ही मैंने डेवलपर कंसोल

खोलने विशेष रूप से अंतिम बिंदु एक मैं के बारे में सबसे सोच रहा हूँ है काम करता है। मुझे लगता है कि डेवलपर कंसोल खोलना कुछ जावास्क्रिप्ट को फिर से निष्पादित करता है।

तो: क्या मैं जावास्क्रिप्ट को पुन: निष्पादित करने के लिए फ़ंक्शन को कॉल कर सकता हूं, जिस तरह डेवलपर कंसोल करता है?

इस कोड है:

<script type="text/javascript"> 
{literal} 
function initialize() { 
    if (GBrowserIsCompatible()) { 

    var map = new GMap2(document.getElementById("map")); //, { size : {width:600,height:600} } 
    map.addControl(new GLargeMapControl3D()); 
    map.addControl(new GMapTypeControl()); 
    map.addControl(new GScaleControl()); 
    map.setCenter(new GLatLng(51.17689812200107, 9.84375), 5); 
    map.checkResize(); 

    var geocoder = new GClientGeocoder(); 

    function showPoint(lat, lon) { 
     if (lat != "" && lon != "") { 
     var point = new GLatLng(lat, lon); 
     map.setCenter(point, 10); 
     var marker = new GMarker(point, {draggable: true}); 
     GEvent.addListener(marker, "dragstart", function() { 
      // map.closeInfoWindow(); 
     }); 
     GEvent.addListener(marker, "dragend", function() { 
      var newPoint = marker.getLatLng(); 
      $('#lat').val(newPoint.lat()); 
      $('#lon').val(newPoint.lng()); 
      // marker.openInfoWindowHtml("Neue Koordinaten Lat: "+ newPoint.lat() +" Lon: "+ newPoint.lng()); 
     }); 
     map.addOverlay(marker); 
     } 
    } 
    {/literal}showPoint("{$gmap_lat}", "{$gmap_lon}");{literal} 
    } 
} 
{/literal} 

यह वह जगह है जहाँ मैं div डाल:

<fieldset style="-moz-border-radius: 1em; -webkit-border-radius: 1em;"> 
     <legend>Karte</legend> 
     <div id="map" title="Lage von '{$name}'"><br>Die Karte wird geladen...<br><br>Hinweis: Damit dies funktioniert müssen Sie in Ihrem Browser JavaScript aktivieren</div> 
     Falls sich der Marker nicht auf der richtigen Position befinden sollte, bewegen Sie diesen mit Ihrer Maus auf die richtige Position. 
     <br>Länge: <input type="text" id="lat" name="lat" value="{$gmap_lat}"> 
     Breite: <input type="text" id="lon" name="lon" value="{$gmap_lon}"> 
    </fieldset> 

और पर div निम्नलिखित सीएसएस नियम लागू होते हैं:

Answer 1

समस्या मिली। मैं ब्लॉक छिपा था, GMaps

<div id="step2" style="display:none"> 

में था लेकिन यह नक्शा युक्त एक ब्लॉक को छिपाया नहीं जा सकता है, जब GMaps भार लगता है।

तो मैं इसे इस

<div id="step2"> 

तरह बदल गया है और सब कुछ काम किया। लेकिन जैसा कि मैं शुरुआत में "step1" दिखाना पसंद करता हूं, मैं

$('#step2').hide(); 

मानचित्र लोड होने के बाद करता है।

यह क्रोम और एफएफ का असली अजीब व्यवहार है, लेकिन मुझे खुशी है कि यह इस कामकाज के साथ काम करता है। आपकी सहायता के लिए धन्यवाद.

Answer 2

यह मदद कर सकता है ...

Google Maps not rendering completely on page?

Answer 3

google.maps.event.trigger (मानचित्र, "आकार बदलें") आज़माएं;

Answer 4

मैंने पाया है कि किसी भी छिपाने और शो के संचालन जो सीएसएस 'प्रदर्शन' संपत्ति (या jQuery छिपाने() और शो() फंक्शन) मानचित्र के आंशिक रूप से देखने के कारण का उपयोग करके गूगल मानचित्र के साथ div पर प्रदर्शन कर रहे हैं।

'प्रदर्शन' के बजाय मैं 'दृश्यता' (छुपा, दृश्यमान) का उपयोग करता हूं और सब कुछ ठीक है। मुझे उम्मीद थी कि एक पॉपअप पर मानचित्र दिखाना था। हालांकि 'दृश्यता' स्थान लेता है जब भी इसकी विशेषता छिपी हुई है, लेकिन चूंकि मैं पॉपअप के लिए 'z-index' का उपयोग करता हूं, यह आधार परत (0 z-index) को प्रभावित नहीं करता है।

सादर Bronek

Answer 5

मैं आंशिक रूप से भरा हुआ गूगल मानचित्र के लिए एक सरल उपाय मिल गया। आम तौर पर यह ऑनलोड() के कारण होता है जब शेष पृष्ठ (आपके मानचित्र तत्व सहित) पूरी तरह से लोड नहीं होता है। यह आंशिक मानचित्र लोड का कारण बनता है। इस समस्या के आस-पास एक आसान तरीका है कि आप अपने ऑनलोड बॉडी टैग एक्शन को निम्नानुसार बदलना चाहते हैं:

old: onload="initialize()" 


new: onLoad="setTimeout('initialize()', 2000);" 

यह 2 सेकंड तक प्रतीक्षा करता है। Google जावास्क्रिप्ट सही आकार विशेषताओं तक पहुंचने से पहले। आशा इस मदद करता है :)

Btw, इस मामले में अपने शीर्ष Javascipt हिस्सा आप गूगल प्रलेखन में वर्णित बिल्कुल के रूप में भटक (लेकिन क्योंकि मैं अक्षांश और PHP चर से देशांतर बोल रहा हूँ, इसलिए पीएचपी के टुकड़े :)

है pagebeforeshow घटना पर प्रारंभ करने के लिए

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
     <script type="text/javascript"> 
     function initialize() { 
     var myOptions = { 
      center: new google.maps.LatLng(<?php echo $my_latitude; ?> , <?php echo $my_longitude; ?>), 
      zoom: 14, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map_canvas"), 
      myOptions); 

      var point = new google.maps.LatLng(<?php echo $my_latitude; ?> , <?php echo $my_longitude; ?>); 
     var marker = new google.maps.Marker({ 
     position:point, 
     map:map })  
    } </script> 

Answer 6

कॉल() और इस

jQuery(document).delegate("#page-map", "pageshow", function(event){ 
google.maps.event.trigger(map, "resize"); 
});