2010-07-15 5 views
6

में मैंने कभी भी एक जटिल स्टोर लोकेटर नहीं बनाया है। उपयोगकर्ता अपने ज़िप में प्रवेश करता है और एक मानचित्र मानचित्र पर संबंधित मार्कर के साथ परिणाम देता है। वे परिणामों के माध्यम से पेज कर सकते हैं और मार्कर आगे और आगे बढ़ते हैं और fitbounds() फ़ंक्शन मार्कर फिट करने के लिए उपयुक्त ज़ूम स्तर पर ज़ूम आउट करने के लिए बहुत अच्छा काम करता है। समस्या यह है कि यदि आप निकटतम स्थानों पर वापस आते हैं तो fitbounds() ज़ूम इन नहीं करता है। भले ही आप एक नई खोज दर्ज करते हैं, यह उन नए मार्करों के आसपास ज़ूम नहीं करता है - यह उन पर केंद्रित है लेकिन जो भी ज़ूम स्तर पर रहता है पहले मुझे लगता है कि इसका मतलब बनता है। यदि कोई जानता है कि मुझे निकट परिणामों पर ज़ूम इन करने के लिए क्या जोड़ना है, तो कृपया मदद करें। ये वे Google फ़ंक्शंस हैं जिन्हें मैं अपने मार्कर पुशिंग फ़ंक्शन के अंत में कॉल कर रहा हूं:Google मैप्स एपीआई वी 3 फिटबाउंड() ज़ूम आउट करता है लेकिन

map.setCenter(bounds.getCenter()); 
    map.panToBounds(bounds); 
    map.fitBounds(bounds); 

धन्यवाद!

उत्तर

0
map.setZoom(10); 

मुझे विश्वास है कि स्वीकार्य सीमा 1-20 है। केवल पूरे नंबर, decimals मेरे अनुभव में नक्शा तोड़ दिया।

4

यह सही है, fitBounds केवल सुनिश्चित करता है कि प्रदान की गई सीमाएं दिखाई दे रही हैं। यह उचित स्तर पर ज़ूम नहीं करता है।

आप पहले setZoom(20) पर कॉल कर सकते हैं, फिर फिटबाउंड।

3

हम्म, दिलचस्प .. मैं सभी (होना) मार्कर निर्देशांक के माध्यम से लूप के लिए PHP का उपयोग करता हूं और दक्षिणवेस्ट और उत्तर-पूर्व के मानों की गणना करता हूं; उत्पत्ति के कोर दो के बीच आधा रास्ते हैं। यदि सभी मार्कर निर्देशांक एक-दूसरे के बहुत करीब हैं, तो फिटबॉउंड द्वारा निर्धारित ज़ूम कारक मानचित्र निर्माण पर उपयोग किए गए 15 की तुलना में बहुत अधिक (ज़ूम इन) है। यही कारण है कि .. क्यों मुझे लगता है कि अंतिम पंक्ति को शामिल किया है है

var map; 

function mapInit() { 
    var origin = new google.maps.LatLng(59.33344615, 18.0678188); 
    var options = { 
    zoom: 15, 
    center: origin, 
    mapTypeControlOptions: { 
     mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.HYBRID] 
    }, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById("googlemap"), options); 

    var southWest = new google.maps.LatLng(59.3308415, 18.0643054); 
    var northEast = new google.maps.LatLng(59.3360508, 18.0713322); 
    var bounds = new google.maps.LatLngBounds(southWest, northEast); 
    map.fitBounds(bounds); 

    google.maps.event.addListenerOnce(map, "idle", function() { 
    if (map.getZoom() > 16) map.setZoom(16); 
    }); 

तो, या तो गूगल समारोह रीप्रोग्राम है या जब से तुम प्रश्न पोस्ट .. मैं अपने कोड के बारे में अधिक जानकारी की जरूरत है।

0
fitBounds: function(bounds, mapId) 
    { 
     //bounds: bounds, id: map id 
     if (bounds==null) return false; 
     maps[mapId].fitBounds(bounds); 
    }, 

यह मदद करनी चाहिए, मैं इस विधि का उपयोग करता हूं और ठीक काम करता हूं, मानचित्र v2 पर थोड़ा अलग तरीके से।

7

यहां कुछ भी आवश्यक कल्पना नहीं है। पहले फिट सीमाएं तब पैन करें। यह आपको उचित ज़ूम देगा और पूरी सीमाएं रखेगा।

map.fitBounds(bounds); 
map.panToBounds(bounds); 
+1

ऐसा लगता है कि यह काम करता है। मुझे आश्चर्य है कि 'पैनबाउंड्स' को 'फिटबाउंड' के बिना क्या करना है। – dbkaplun

9

समस्या यह है: हम

var bounds = new google.maps.LatLngBounds(); 

सेट इतना है कि हम बाद में नक्शे पर एक घिरे क्षेत्र के लिए हमारी मार्करों फिट कर सकते हैं। जीमैप्स हमेशा फिट करने के लिए असीमित रूप से ज़ूम आउट करेगा() तदनुसार, लेकिन इसे प्राप्त करने के लिए ज़ूम इन नहीं करेगा (जैसा कि पहले @broady द्वारा नोट किया गया था)। यह कई अनुप्रयोगों के लिए आदर्श नहीं है जब आप एक बार गए हैं और मानचित्र पर मार्करों की एक श्रृंखला प्रदर्शित की है जिसके कारण मानचित्र ज़ूम आउट हो सकता है (शायद < 10), उपयोगकर्ता मैन्युअल रूप से ऐसा करने के बिना वापस ज़ूम नहीं करेगा।

जीएमएपीएस मार्कर संग्रह स्थिति (क्षमा करें) ज़ूम आउट की बेहतर सीमाओं (बेहतर शब्दों की कमी) की सीमाओं का उपयोग करना जारी रखेगा। नए मार्करों के लिए प्रत्येक कॉल से पहले 'शून्य' पर सेट करना आपको काम करने के लिए एक नया नक्शा देता है।

ऑटो-ज़ूम इन करने के लिए, बस LatLngBounds() सेट करें; 'अशक्त' की तरह तो (इसकी नियुक्ति को देखने के लिए नीचे दिए गए छद्म उदाहरण देखें) करने के लिए:

bounds = new google.maps.LatLngBounds(null); 

छद्म उदाहरण:

// map stuff/initiation 
... 

var bounds = new google.maps.LatLngBounds(); 
var gmarkers = []; 

function CreateMarker (obj) { 
    myLatLng = new google.maps.LatLng(obj['latitude'], obj['longitude']); 
    marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map 
    }); 
    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
      infowindow.setContent(obj['job']); 
      infowindow.open(map, marker); 
     } 
    })(marker, i)); 
    bounds.extend(myLatLng); 
    gmarkers.push(marker); 
} 

.... 

// here's an AJAX method I use to grab marker coords from a database: 

$.ajax({ 
    beforeSend: function() { 
     clear_markers(gmarkers); // see below for clear_markers() function declaration 
    }, 
    cache: false, 
    data: params, 
    dataType: 'json', 
    timeout: 0, 
    type: 'POST', 
    url: '/map/get_markers.php?_=<?php echo md5(session_id() . time() . mt_rand(1,9999)); ?>', 
    success: function(data) { 
     if (data) { 
      if (data['count'] > 0) { 
       var obj; 
       var results = data['results']; 

       // Plot the markers 
       for (r in results) { 
        if (r < (data['count'])) { 
         CreateMarker(results[r]); 
        } 
       } 
      } 
     } 
    }, 
    complete: function() { 
     map.fitBounds(bounds); 
    } 
}); 

// clear_markers() 
function clear_markers(a) { 
    if (a) { 
     for (i in a) { 
      a[i].setMap(null); 
     } 
     a.length = 0; 
    } 
    bounds = new google.maps.LatLngBounds(null); // this is where the magic happens; setting LatLngBounds to null resets the current bounds and allows the new call for zoom in/out to be made directly against the latest markers to be plotted on the map 
} 
+0

धन्यवाद जॉन स्मिथ! आपका सुझाव एकमात्र तरीका था जिसे मैं मार्कर हटाने के बाद वापस ज़ूम करने में सक्षम था। मैं आपकी पोस्ट में विस्तार की सराहना करता हूं। – gorelog

+0

धन्यवाद आदमी ... आपने मेरा दिन बचाया :-) – Legionar

1

ऐसा लगता है कि जब आप map.getBounds() फोन यह एक छोटे अंतर से व्यूपोर्ट रिटर्न किनारों के चारों ओर। चूंकि यह नई सीमाएं मौजूदा सीमाओं से बड़ी हैं, इसलिए नक्शा हमेशा ज़ूम आउट होगा। मैं वर्तमान मानचित्र की सीमाओं को पूरी तरह से उपयोग करने और एक अलग LatLngBounds चर को बनाए रखने से बचकर इसे हल करने में सक्षम था। हर बार जब मैं एक बिंदु जोड़ा मैं कहा जाता है:

markersBounds.extend(newMarkersLatLng); 
map.fitBounds(markersBounds); 
map.panToBounds(markersBounds); 

अंक (मैं हमेशा उन्हें जोड़ने गया था), आप एक नया LatLngBounds पहला बिंदु के साथ वस्तु, तो प्रत्येक शेष बिंदु का विस्तार अपने नए सीमा प्राप्त करने के लिए कर सकता है निकालने के लिए:

var markersBounds = new google.maps.LatLngBounds(markers[0].getPosition(), 
               markers[0].getPosition()); 
for(var i=1; i<markers.length; i++){ 
    markersBounds.extend(markers[i].getPosition()); 
} 

map.fitBounds(markersBounds); 
map.panToBounds(markersBounds); 
1

मुझे नए मार्करों के साथ एक ही मानचित्र पर दूसरी बार फिटबाउंड कॉल करने पर मानचित्र ज़ूमिंग के तरीके के साथ कोई समस्या थी।

// This is a stationary point tho dynamic will work too 

var myLat = someLat, 
    myLng = someLong; 

var map = false, 
    markersArray = []; 

function makeOrderMap(lat, lng) { // pass in dynamic point when updating map 

    var mapOptions = { 
     center: new google.maps.LatLng(myLat, myLng), 
     zoom: 16, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    deleteOverlays(); // remove any existing markers.. 
    if(!map) { 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    } 

    // Find the mid-point to center the map 

    midLat = (parseFloat(lat) + parseFloat(myLat))/2; 
    midLng = (parseFloat(lng) + parseFloat(myLng))/2; 
    map.setCenter(new google.maps.LatLng(midLat, midLng)); 
    var newSpot = new google.maps.LatLng(lat, lng); 

    placeMarker(mapOptions.center);  
    placeMarker(newSpot); 

    // determine the distance between points for deciding the zoom level 

    var dist = distHaversine(mapOptions.center, newSpot); 

    var zoom = 10; 
    if(dist < 1.25) { 
    zoom = 15; 
    } else if(dist < 2.5) { 
    zoom = 14; 
    } else if(dist < 5) { 
    zoom = 13; 
    } else if(dist < 10) { 
    zoom = 12; 
    } else if(dist < 20) { 
    zoom = 11; 
    } 
    map.setZoom(zoom); 
} 


rad = function(x) {return x*Math.PI/180;} 

distHaversine = function(p1, p2) { 
    var R = 6371; // earth's mean radius in km 
    var dLat = rad(p2.lat() - p1.lat()); 
    var dLong = rad(p2.lng() - p1.lng()); 

    var a = Math.sin(dLat/2) * Math.sin(dLat/2) + 
      Math.cos(rad(p1.lat())) * Math.cos(rad(p2.lat())) * Math.sin(dLong/2) * Math.sin(dLong/2); 
    var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
    var d = R * c; 

    return d.toFixed(3); 
} 

function deleteOverlays() { 
    if (markersArray) { 
     for (i in markersArray) { 
      markersArray[i].setMap(null); 
     } 
    markersArray = [];  
    markersArray.length = 0; 
    }  
} 

function placeMarker(location, alt_icon) { 

    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
     }); 

    // add marker in markers array 
    markersArray.push(marker); 
} 
+0

धन्यवाद, यह आपके क्रियान्वयन से एक कोणीय सेवा के रूप में कार्य कर रहा है: https://gist.github.com/zmijevik/047c40f4fc0bea27fd7c –

0

मैं आज यह सामान्य समस्या हुई है, सोचा था कि मैं एक समाधान का हिस्सा हैं: यह frankensolution कि मेरे लिए काम करता है। मुझे एहसास है कि यह आपके 'स्टोर लोकेटर' समस्या से थोड़ा अलग है, लेकिन यह कई तरीकों से लागू होता है। मेरे मामले में मेरे पास मानचित्र पर मार्करों का संग्रह है और मैं एक जोड़ रहा हूं, और यह सुनिश्चित करना चाहता हूं कि सभी मार्कर अब देख रहे हैं। यह कोड प्रत्येक मौजूदा मार्कर को देखने के लिए जांचता है कि क्या यह दृश्य में है, और साथ ही, एक नया बाउंडिंग बॉक्स बनाता है जिसमें आवश्यकतानुसार सभी शामिल होंगे। अंत में, यदि कोई भी ध्यान में नहीं पाया गया है, तो दृश्य रीसेट हो गया है, इसलिए वे सभी हैं।

(इस डोजो के सरणी मॉड्यूल, बुनियादी सरणी यात्रा के चारों ओर बस एक सुविधा आवरण का उपयोग करता है)

var origBounds = map.getBounds(), 
    newBounds = new google.maps.LatLngBounds(null), 
    anyFailed = false; 
array.forEach(markers, function (m) { 
    newBounds.extend(m.position); 
    if (!origBounds.contains(m.position)) { 
     anyFailed = true; 
    } 
}); 
if (anyFailed) { 
    map.setCenter(newBounds.getCenter()); 
    map.fitBounds(newBounds); 
} 

एक आसानी से केवल सुनिश्चित नया मार्कर, ध्यान में रखते हुए है पाशन नहीं और सिर्फ एक में शामिल करने से यह संशोधित कर सकते() नए मार्कर पर जांचें।

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