Google मानचित्र

नहीं दिखा रहा है मेरे पास एक Google मानचित्र है जो दिखाई नहीं देगा। समस्या एफएफ & क्रोम में समान प्रतीत होती है, लेकिन आईई (हमेशा नवीनतम संस्करण) में और भी "खराब"।Google मानचित्र

एफएफ & क्रोम में मुझे position: relative; सीएसएस तत्व शैली के साथ कोई समस्या है। जैसे ही मैं स्विच करता हूं (देव उपकरण के साथ) position: absolute(or: fixed); सबकुछ एफएफ में ठीक दिखता है। क्रोम में मानचित्र केवल ऊपरी 30% (शीर्ष से) दिखाता है।

आईई में नक्शा भी लोड नहीं होता है।

यहां <head> से स्क्रिप्ट सामग्री है। सामग्री केवल परीक्षण के लिए है और इसका मतलब कुछ भी नहीं है। नोट: मैं केवल नक्शा लोड करने के लिए इसका उपयोग करता हूं। बाद में इसका आदान-प्रदान किया जाएगा।

<!-- Script inside <head> tag --> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js? 
     file=api&amp; 
     v=2&amp; 
     key=<?php echo self::GOOGLE_API_KEY; ?>&amp; 
     sensor=false"> 
    </script> 
    <script type="text/javascript"> 
    function initialize() 
    { 
     var startpos = new google.maps.LatLng(50.978056,11.029167); 
     var ops = { 
      zoom:  6 
      ,center: startpos 
      ,mapTypeId: 
       google.maps.MapTypeId.ROADMAP 
       ,tileSize: new google.maps.Size(256, 256) 
     } 
     var map = new google.maps.Map(document.getElementById("map_canvas"), ops); 
     var pos1 = new google.maps.LatLng(50.7510776,12.4820724); 
     var contentString1 = '<div align="left" dir="ltr" class="infowin"><h3>test</h3>testen</div>'; 
     var infowindow1 = new google.maps.InfoWindow({ 
      content: contentString1 
      ,maxWidth: 5 
     }); 
     var marker1 = new google.maps.Marker({ 
      position: pos1 
      ,map:  map 
      ,title: 'test' 
     }); 
     google.maps.event.addListener(
      marker1 
      ,'click' 
      ,function() { 
       infowindow1.open(map, marker1); 
      } 
     ); 
    } 
    </script>

इस पृष्ठ के लिए पूरे निशान निर्भर है।

<!-- html markup - There *really* isn't anything else --> 
<body onload="initialize()"> 
<div id="map_canvas" style="width:100%; height:100%;"></div> 
</body>

मैंने कुछ भी खोजे बिना Google पर बहुत समय बिताया है। कोई विचार? धन्यवाद!

स्रोत

2011-08-03 kaiser

html, bodyheight:100%; होना चाहिए।

लेकिन ध्यान रखें, यदि आपका नक्शा धारक तत्व एक और तत्व का एक बच्चा तो उस तत्व भी height:100%;

अन्यथा होना चाहिए, बस एचटीएमएल और शरीर की स्थापना आप किसी भी अच्छा काम नहीं चलेगा।

एक उदाहरण मेरी बात समझाने के लिए:

<html> 
<head> 
    <style> 
     html, body { height:100%; } 
    </style> 
</head> 
<body> 

<div id="wrapper"> 
    <div id="google-map-holder" style="width:100%; height:100%;"></div> 
</div> 

</body> 
</html>

तो, आप ऊपर की तरह कुछ कर रहे हैं। height:100%; यहां काम नहीं करेगा।

यह काम करने के लिए, आप माता-पिता के सभी के साथ एक ही बात करने के लिए है कि #google-map-holder का एक बच्चा, इस मामले में हम height:100%;#wrapper तत्व को जोड़ना होगा है।

अगर, #google-map-holder तत्व #wrapper तत्व और body का एक बच्चा बाहर सीधे था सीधे तो बस html, body कर पर्याप्त होगा।

स्रोत

2012-05-14 11:31:30 Zubair1

समस्या #map_canvas के height: 100%; है।

अपने < सिर > को यह जोड़े और यह काम करना चाहिए (फ़ायरफ़ॉक्स 5 और सफारी 5.1 में परीक्षण किया गया):

<style> 
    html, body { 
    height: 100%; 
    } 
</style>

विवरण के लिए क्यों यह जरूरी है कि इस सवाल का जवाब पहले पर एक नजर है:

Div 100% height works on Firefox but not in IE

स्रोत

2011-08-03 17:55:25

मैंने अपनी मूल स्टाइलशीट पर एक नज़र डाली और सोचा कि यह पहले से ही वहां है, लेकिन: नहीं, यह नहीं था। सर उठाने के लिए धन्यवाद! +1 – kaiser

Google मानचित्र

उत्तर

संबंधित मुद्दे