FullscreenControl और मानचित्र केंद्र

Question

वर्तमान में बनाए रखने, ऐसा लगता है कि अगर मैं कहूँ एक विनय गूगल मैप्स (300px गुणा 300px) बंदरगाह प्रदर्शित FullscreenControl सक्षम के साथ आकार, और मैं केंद्र, जो किसी विशेष क्षेत्र, जैसे ... फ्रांस से अधिक छोटे मानचित्र दृश्य , उदाहरण के लिए ... और फिर मैंने अपनी स्क्रीन के किनारों पर प्रदर्शन का विस्तार करने के लिए पूर्ण स्क्रीन बटन दबाया (1080px द्वारा 1920px), फ्रांस मेरी स्क्रीन के ऊपरी-बाएं कोने में रास्ते से टकरा गया।

मूल रूप से, मूल 300px x 300px डिस्प्ले का शीर्ष-बायां मेरी स्क्रीन के ऊपरी-बाईं ओर जाता है, और बाकी दुनिया का नक्शा मूल ज़ूम स्तर पर उस कोने से फैला हुआ है।

वहाँ किसी भी तरह से मूल रूप से बस इसे सेट अप करने के लिए इतना है कि पूर्ण स्क्रीन प्रदर्शन जब पूर्ण स्क्रीन मोड को बंद कर दिया जाता है मूल प्रदर्शन, और इसके विपरीत के रूप में ही केंद्र बिंदु होने को खोलता है?

टॉगल पूर्ण स्क्रीन बटन एक घटना या कुछ भी है कि मैं करने के लिए एक setCenter हुक कर सकते हैं गति प्रदान करता है?

Answer 1

इस

/** To detect Map Full Screen event */ 
google.maps.event.addListener(map, 'bounds_changed', onBoundsChanged); //Event listener map bound change. 
var isMapFullScreen = false; 
var defaultLocation = { 
    lat: 27.94, 
    lng: -82.45 
}; 
function onBoundsChanged() { 
    if(!isMapFullScreen){ 
     var isFullHeight = $(map.getDiv()).children().eq(0).height() == window.innerHeight; 
     var isFullWidth= $(map.getDiv()).children().eq(0).width() == window.innerWidth; 
     if (isFullHeight && isFullWidth) { 
      isMapFullScreen = true; 
      myMarker.setPosition(defaultLocation); 
      map.setCenter(defaultLocation); 
      console.log('FULL'); 
     } else { 
      isMapFullScreen = false; 
      console.log('NOT-FULL'); 
     } 
    } 
} 

Answer 2

मैं एक कोड थोड़ा अजीब रचना की कोशिश करो, लेकिन यह पूरी तरह से काम करता है:

<script> 
    var map; 
    var center = -1; 
    var isFullScreen = false; 
    function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 8, 
      center: { lat: -34.397, lng: 150.644 } 
     }); 
     center = { lat: map.getCenter().lat(), lng: map.getCenter().lng() }; 
     google.maps.event.addDomListener(map, 'bounds_changed', onBoundsChanged); 
    } 
    function onBoundsChanged() { 
      var isFullHeight = $(map.getDiv()).children().eq(0).height() == window.innerHeight; 
      var isFullWidth = $(map.getDiv()).children().eq(0).width() == window.innerWidth; 
      if (isFullHeight && isFullWidth && !isFullScreen) { 
       isFullScreen = true; 
       map.setCenter(center); 
       console.log('FULL'); 
      } else if (!isFullWidth||!isFullHeight){ 
       if (isFullScreen) { 
        map.setCenter(center); 
       } 
       isFullScreen = false; 
       console.log('NOT-FULL'); 
      } 
      center = { lat: map.getCenter().lat(), lng: map.getCenter().lng() };    
    } 
</script> 

मैं bounds_changed घटना का उपयोग करें।

अगर मैं पता लगाने कि नक्शा पूर्ण स्क्रीन में है मैं केंद्र है कि मैं मिसाल घटना में ध्यान दें में नक्शे की स्थापना की और मैं सच करने के लिए एक बूलियन सेट। यदि नक्शा पूर्ण स्क्रीन में नहीं है, तो मैं जांचता हूं कि बूलियन सत्य है या नहीं, इसका मतलब है कि पिछली घटना में नक्शा पूर्ण स्क्रीन में था, इसलिए मैं नक्शा हाल ही में करता हूं और अगली बार जांच करता हूं कि बूलियन गलत है या नहीं। घटना के अंत में, मैं केंद्र को अगले कार्यक्रम के लिए एक चर में रखता हूं।

यह सब

बहुत स्पष्ट नहीं हैं ...

आप स्टैक ओवरफ़्लो में this पोस्ट देखें सकता है।

नोटिस:इस कोड को अगर आप अपने वेब अनुप्रयोग के सभी पेज में एक भी नक्शा प्रदर्शित काम नहीं करता। मुझे इस बग को हटाने का कोई तरीका नहीं है। आपके सुझावों की बहुत सराहना की जाती है, धन्यवाद।

यह भी ध्यान दें:मेरा कोड पिछले उत्तर से प्रेरित है। हालांकि आप एक ही कोड here पा सकते हैं। कृपया ध्यान दें कि यह एक डुप्लिकेट उत्तर नहीं है। मैं इसमें कोड का अपना हिस्सा जोड़ता हूं।

मुझे बताओ कि तुम कुछ प्रश्न या टिप्पणी है, तो।