2010-07-10 13 views
8

के साथ काम नहीं कर रहा है क्यों पृथ्वी पर हमेशा एक मौका है कि यदि हम Google मानचित्र के साथ "डॉक्टरेट" का उपयोग करते हैं, तो Google मानचित्र को सही तरीके से दिखाने में कोई समस्या होगी?Google मानचित्र एक्सएचटीएमएल डॉक्ट टाइप (दस्तावेज़ प्रकार)

हाल के मामले में, इस "डॉक्टरेट" ने बिना किसी उत्पादकता के अपने 2 दिन लग गए। क्या घृणित मामला है? इस बार मुझे अपने सहयोगी (सुभंकर बनर्जी) में से एक से मदद मिली, और उनके समय पर & कुशल मदद के कारण उनके लिए बहुत धन्यवाद। उन्होंने इस समस्या के बारे में भी उल्लेख किया, जिसे उन्होंने कई बार सामना किया था।

क्या कोई मुझे बता सकता है कि Google मानचित्र के साथ यह डॉक्टरेट समस्या क्यों होती है?

किसी भी मदद की बहुत सराहना की जाती है।

संपादित करें (@Balus की टिप्पणी के लिए): -
मैं (एक्स) एचटीएमएल 1.0 संक्रमणकालीन Doctype, मोज़िला एफएफ & गूगल क्रोम ब्राउज़र के लिए उपयोग कर रहा था। मैंने अभी तक आईई v6 + में इस Google मानचित्र की जांच नहीं की है, इसलिए मैं उन ब्राउज़रों पर टिप्पणी नहीं कर सकता।

+1

वास्तव में कौन सा सिद्धांत? कौन सा वेबब्रोर्स बिल्कुल? क्या आप जानते हैं (और समझते हैं) http://hsivonen.iki.fi/doctype/? – BalusC

+0

@ बालस - प्रदान किया गया अच्छा लिंक। धन्यवाद –

+2

http://stackoverflow.com/questions/2127601/doctype-error-with-googlemaps – iamgopal

उत्तर

16

मुझे कुछ समय पहले Google Maps API v3 के साथ एक ही समस्या थी और मुझे कहना होगा कि इसे डीबग करना आसान नहीं था।

यहां बात यह है कि यदि आप अपने पृष्ठ पर DOCTYPE का उपयोग नहीं करते हैं, तो पेज क्विर्क मोड में प्रस्तुत किया जाता है। असल में यह बिना किसी अतिरिक्त सीएसएस या जावास्क्रिप्ट के शैलियों का उपयोग करने की अनुमति देता है।

<body onload="initialize()"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
</body> 

हालांकि, ऐसा कहते पेज DOCTYPE साथ DOCTYPE की तरह प्रदान की गई है: इस मामले में आप नक्शे लोड करने के लिए इस बिट इस्तेमाल कर सकते हैं। ऊपर की तरह एक शैली की स्थापना किसी भी अतिरिक्त सीएसएस के बिना काम नहीं करेगा क्योंकि यह प्रतिशत का उपयोग कर रहा है। तत्व का आकार नहीं है, इसलिए आप 100% कुछ भी नहीं लेते हैं। तो यदि आप एक्सएचटीएमएल 1.0 सख्त, यानी उपयोग कर रहे हैं।

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd"> 

पेज renders के रूप में यह अगर तुम प्रतिशत के बजाय पिक्सल का उपयोग करना चाहिए: आप सीएसएस में वह भी कर सकता है

<body onload="initialize()"> 
    <div id="map_canvas" style="width:500px; height:400px"></div> 
</body> 

तो अपने विकल्पों को यहां हैं:

  1. DOCTYPE छोड़ दो और प्रतिशत या के बजाय पिक्सेल का उपयोग चौड़ाई और सीएसएस के माध्यम से ऊँचाई निर्दिष्ट।

  2. DOCTYPE को हटाएं और प्रतिशत का उपयोग करें। यह अनुशंसा नहीं की जाती है क्योंकि दस्तावेज़ हमेशा यह कहना चाहिए कि इसे किस डीटीडी के साथ प्रस्तुत किया जाना चाहिए।

आप वहाँ भी एक मेज जो दिखाता है कि कैसे अलग-अलग ब्राउज़र DTD की कमी करने के लिए प्रतिक्रिया है here. से क्वर्क्स मोड के बारे में अधिक जानकारी पा सकते हैं।

+1

+1 इस सीएसएस का उपयोग करें - .map {width: 500px; ऊंचाई: 500 पीएक्स; स्थिति: तय! महत्वपूर्ण; बाएं: 0; जेड-इंडेक्स: 1; शीर्ष: 0;} –

+0

मानचित्र ऑब्जेक्ट 'document.getElementById ("google-map") बनाने से पहले इसका उपयोग करें। style.height = $ (विंडो) .height() +' px '; ' – kushpf

1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

मैं इस सिद्धांत का उपयोग कर रहा हूं, और ऐसा लगता है कि यह ठीक काम कर रहा है। यह सिर्फ आपका बूटस्ट्रैप हो सकता है। आप Google को कैसे लोड कर रहे हैं? आपको क्या त्रुटियां मिल रही हैं? प्रदर्शित करें कि आप किस प्रकार का परिणाम प्राप्त कर रहे हैं?

0

आपका प्रश्न कहता है "अगर हम 'डॉक्टरेट' का उपयोग करते हैं"। क्या इसका मतलब है कि आप पहले नहीं थे? यदि आपने पहले नहीं किया था, तो, अनिवार्य रूप से, आप 'नियम' बदल रहे हैं कि एक वेब पेज कैसे रखा जाएगा। एक उचित सिद्धांत के बिना, आप quirks मोड में हैं।

0

एक त्वरित समाधान इस प्रकार के रूप में उपयोग करने के लिए हो सकता है:

document.getElementById("google-map").style.height = $(window).height()+'px';

से पहले

var map = new google.maps.Map(document.getElementById("google-map"), myMapOptions);

यह doctype साथ बहुत अच्छी तरह से काम करता है। आजमाया और परखा गया! :)

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