मानचित्र पर मानचित्रबॉक्स स्क्रॉल पेज

Question

मैं एक लेआउट पर मैपबॉक्स को लागू करने की कोशिश कर रहा हूं जो पृष्ठ का 100% भरता है। मैंने नक्शा ज़ूम विकल्पों को अक्षम कर दिया है लेकिन समस्याएं तब आती हैं जब स्पर्श डिवाइस पर स्क्रॉल करने का प्रयास किया जाता है जहां नक्शा व्यूपोर्ट भरता है। क्या मैं इसे ओवरराइड कर सकता हूं या ब्राउज़र को इसे एक छवि की तरह व्यवहार कर सकता हूं?

Answer 1

इस उदाहरण में सुधार किया गया है: लाइन है कि याद आ रही थी है:

if (map.tap) map.tap.disable();

यह टच डिवाइस पर नल की घटनाओं की हत्या से नक्शा नहीं कर पाएगा।

Answer 2

शेष श्रोताओं को हटाएं as in this example - जो आपके पास अभी भी dragging है।

L.DomEvent.preventDefault = function(e) {return;} 

रूपरेखा ब्राउज़र है कि अन्यथा रोका द्वारा तत्व के चारों ओर रखा निकालने के लिए:

Answer 3

हाँ, आप को रोकने डिफ़ॉल्ट कार्रवाई से MapBox श्रोताओं कुछ भी नहीं करना पत्रक समारोह की स्थापना द्वारा बंद कर सकते हैं आप जोड़ सकते हैं:

*:focus { 
    outline: none; 
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); 
    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important; 
} 

यह मेरे लिए स्पर्श उपकरणों पर स्क्रॉल करने की अनुमति है, हालांकि मैंने केवल एंड्रॉइड पर परीक्षण किया है। ध्यान दें कि इसका आपके आवेदन पर अन्य परिणाम हो सकते हैं - इन्हें शायद mapbox.js में जाकर और केवल कॉल करने वाले श्रोताओं से ही इस कॉल को हटाया जा सकता है।

Answer 4

आदि उन गतिशील सक्षम करने के लिए/अक्षम नक्शा बॉक्स स्क्रॉल चाहते हैं कि/जूमिंग पेज आकार के आधार पर लिए

(मैंने किया था के रूप में) आप कोशिश कर सकते हैं:

$(document).ready(function() { 
    $(window).on('resize', updateMap); 
}); 

function updateMap() { 
    var width = $(window).width(); 
    if (width < 768) { 
    map.scrollWheelZoom.disable(); 
    map.doubleClickZoom.disable(); 
    map.dragging.disable(); 
    if (map.tap) map.tap.disable(); 
    } 
    else { 
    map.scrollWheelZoom.enable(); 
    map.doubleClickZoom.enable(); 
    map.dragging.enable(); 
    if (map.tap) map.tap.enable(); 
    } 
} 

अपने लेआउट के लिए उपयुक्त जादू संख्या से 768 बदलें। JQuery लगता है। दोनों क्लिक और वापसी पकड़ एक माउस या अन्य डिवाइस ओर इशारा करते हुए और स्वाइप गति खींचें स्पर्श का उपयोग कर के साथ खींच

Answer 5

MapBox में dragging पैरामीटर के साथ

if (map.tap) map.dragging.disable(); 

Answer 6

समस्या जोड़ने की कोशिश है कि यह नियंत्रित करता है। सुनिश्चित नहीं है कि अन्य उत्तरों में से कोई भी मुख्य मुद्दा के रूप में स्पष्ट करता है।

समस्या का दिल जो मुझे लगता है कि ओपी हो रहा है यह है कि हम सभी क्लिक-ड्रैगिंग पसंद करते हैं और सोचते हैं कि इसका उपयोग करना आसान है, लेकिन हमें टच-ड्रैगिंग पसंद नहीं है क्योंकि यह क्षमता में हस्तक्षेप करता है पूरे पृष्ठ को स्क्रॉल करें।

यह कोड का उपयोग है जिसे मैं समाप्त कर रहा हूं। यह Modernizr और jQuery पर निर्भर करता है, लेकिन यदि आपको आवश्यकता हो तो आप उनके बिना कुछ लिख सकते हैं।

// disable dragging the map on touch devices only 
if ($('html').hasClass('touch')) map.dragging.disable();