कैनवास पर आकार बदलने के लिए कैसे / ताज़ा करें?


9

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

किसी भी मार्गदर्शन और मदद की सराहना की है।

यहाँ काम करने का उदाहरण है: डेमो


जवाबों:


13

map.updateSize();के अंत में जोड़ें$("#btn-full-screen").click...

डेमो

अद्यतन प्रलेखन

इस फ़ंक्शन को किसी भी बाहरी कोड द्वारा बुलाया जाना चाहिए जो गतिशील रूप से मैप डिव का आकार बदलता है (क्योंकि मोज़िला हमें किसी तत्व के लिए "ऑनरेसेज़" को पकड़ने नहीं देगा)


5

OpenLayers.Map.updateSizeजब आप मानचित्र को अधिकतम करते हैं तो आप अपने आधार परत को फिर से बनाने के लिए विधि का उपयोग कर सकते हैं ।

इसलिए, एक फ़ंक्शन को जोड़ना जैसे:

var fullScreen = function () {
    map.baseLayer().redraw();
}

आपको केवल अपने मानचित्र में एक अतिरिक्त विकल्प जोड़ना होगा:

var map = new OpenLayers.Map({
    div: "map",
    center: new OpenLayers.LonLat(0, 0),
    updateSize: fullScreen,
    minResolution: "auto",
    minExtent: new OpenLayers.Bounds(-1, -1, 1, 1),
    maxResolution: "auto",
    maxExtent: new OpenLayers.Bounds(-180, -90, 180, 90),
    projection: Mercator,
    displayProjection: Geographic
});

सौभाग्य!


यह पूर्ण स्क्रीन के लिए मानचित्र सेट नहीं करता है, क्या आप कृपया फ़िडेल को अपडेट कर सकते हैं।
बाय

धन्यवाद। उपयोग करते समय ज़ूम करने पर मेरे पास टाइलें सफेद हो रही थीं transitionEffect: 'resize'map.baseLayer().redraw();ठीक कर दिया।
निकोलस बोइस्टाल्ट

0

निम्न कोड को लिखें जब भी आपको मानचित्र को फिर से लिखना आवश्यक हो जैसे कि खिड़की पर आकार परिवर्तन या टैब परिवर्तन या पूर्ण स्क्रीन पर या किसी अन्य घटना पर अपनी आवश्यकता के अनुसार।

$(window).trigger('resize');

यह स्वचालित रूप से updateSize()फ़ंक्शन को आंतरिक रूप से ट्रिगर करेगा ।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.