javascript - google maps india




গুগল ম্যাপস এপিআই v3: কিভাবে সব চিহ্নিতকারী অপসারণ? (20)

গুগল ম্যাপস এপিআই ভি 2, যদি আমি সব মানচিত্র চিহ্নিতকারী মুছে ফেলতে চাই, আমি কেবল তা করতে পারি:

map.clearOverlays();

গুগল ম্যাপস এপিআই ভি 3 এ কিভাবে করব?

রেফারেন্স এপিআই এ খুঁজছেন, এটা আমার কাছে অস্পষ্ট।


Anon থেকে নিম্নলিখিত পুরোপুরি কাজ করে, যদিও flickers বারবার overlays ক্লিয়ারিং সঙ্গে।

শুধু নিম্নলিখিত কাজ করুন:

I. একটি বৈশ্বিক পরিবর্তনশীল ঘোষণা:

var markersArray = [];

২। একটি ফাংশন সংজ্ঞায়িত করুন:

function clearOverlays() {
  if (markersArray) {
    for (i in markersArray) {
      markersArray[i].setMap(null);
    }
  }
}

তৃতীয়। নীচের কল করার আগে 'মার্কারআরে' এর মধ্যে push markers:

markersArray.push(marker);
google.maps.event.addListener(marker,"click",function(){});

চতুর্থ। প্রয়োজন যেখানে clearOverlays() ফাংশন কল।

এটাই!!

আশা করি যে আপনার সাহায্য করবে।


Google এর ডেমো গ্যালারিটি কীভাবে করে তা নিয়ে একটি ডেমো রয়েছে:

overlay-overview

আপনি কীভাবে মার্কার যুক্ত করবেন তা দেখতে উত্স কোডটি দেখতে পারেন।

দীর্ঘ গল্প সংক্ষিপ্ত, তারা একটি গ্লোবাল অ্যারে চিহ্নিতকারী রাখা। যখন তাদের সাফ করা / মুছে ফেলা হয়, তারা অ্যারের মাধ্যমে লুপ করে এবং প্রদত্ত মার্কার বস্তুর উপর ".setMap (null)" কল করুন।

তবে, এই উদাহরণটি একটি 'কৌশল' দেখায়। এই উদাহরণটির জন্য "সাফ করুন" মানে তাদের ম্যাপ থেকে মুছে ফেলা কিন্তু তাদের অ্যারে রাখা, যা অ্যাপ্লিকেশানটিকে দ্রুত মানচিত্রে পুনরায় জুড়তে দেয়। একটি অর্থে, এই তাদের "গোপন" মত কাজ করে।

"মুছুন" এছাড়াও অ্যারে পরিষ্কার করে।


আপনি এই ভাবে এটি করতে পারেন:

function clearMarkers(category){ 
  var i;       

  for (i = 0; i < markers.length; i++) {                          
    markers[i].setVisible(false);        
  }    
}

আপনি তাদের গোপন বা মুছে ফেলা হিসাবে মুছে ফেলা মানে?

লুকানো যদি:

function clearMarkers() {
            setAllMap(null);
        }

যদি আপনি তাদের মুছে ফেলতে চান:

 function deleteMarkers() {
            clearMarkers();
            markers = [];
        }

লক্ষ্য করুন যে আমি তাদের ট্র্যাক রাখতে এবং ম্যানুয়ালি পুনরায় সেট করতে একটি অ্যারে মার্কার ব্যবহার করি।


আমি google-maps-utility-library-v3 প্রজেক্টে মার্কম্যানজার লাইব্রেরি ব্যবহার করে সবচেয়ে সহজ উপায় হিসাবে খুঁজে পেয়েছি।

1. মার্কারম্যানজার সেট আপ করুন

mgr = new MarkerManager(map);
google.maps.event.addListener(mgr, 'loaded', function () {
    loadMarkers();
});

2. MarkerManager চিহ্নিতকারী যোগ করুন

function loadMarkers() {
  var marker = new google.maps.Marker({
            title: title,
            position: latlng,
            icon: icon
   });
   mgr.addMarker(marker);
   mgr.refresh();
 }

3. মার্কারগুলি সাফ করার জন্য আপনাকে মার্কার ম্যানগারের clearMarkers() ফাংশন কল করতে হবে

mgr.clearMarkers();

আমি জানি না কেন, তবে, আমার মার্কারগুলিতে setMap(null) সেটিংটি আমার জন্য কাজ করে না যখন আমি DirectionsRenderer setMap(null) ব্যবহার করছি।

আমার ক্ষেত্রে আমি setMap(null) আমার DirectionsRenderer হিসাবে ভাল ছিল।

এরকম কিছু:

var directionsService = new google.maps.DirectionsService();
var directionsDisplay = new google.maps.DirectionsRenderer();

if (map.directionsDisplay) {
    map.directionsDisplay.setMap(null);
}

map.directionsDisplay = directionsDisplay;

var request = {
    origin: start,
    destination: end,
    travelMode: google.maps.TravelMode.DRIVING
};

directionsDisplay.setMap(map);
directionsService.route(request, function (result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(result);
    }
});

আমি ভাল কাজ করে একটি shorthand ব্যবহার। শুধু কর

    map.clear();

আমি শুধু kmlLayer.setMap (নাল) দিয়ে এটি চেষ্টা করেছি এবং এটি কাজ করেছে। এটি নিয়মিত মার্কারগুলির সাথে কাজ করবে কিনা তা নিশ্চিত না হলেও সঠিকভাবে কাজ করে।


উভয় উত্তরগুলিতে পোস্ট করা " set_map " ফাংশনটি আর Google মানচিত্র v3 API এ কাজ করবে বলে মনে হচ্ছে না।

আমি কি ঘটেছে আশ্চর্য

হালনাগাদ:

মনে হচ্ছে গুগল তাদের এপিআই পরিবর্তন করেছে যেমন " set_map " " setMap " নয়।

http://code.google.com/apis/maps/documentation/v3/reference.html


এই পদ্ধতিটি Google নিজে অন্তত একটি নমুনায় ব্যবহার করে:

var markers = [];

// Clear out the old markers.
markers.forEach(function(marker) {
  marker.setMap(null);
});
markers = [];

সম্পূর্ণ কোড উদাহরণের জন্য Google নমুনা দেখুন:

https://developers.google.com/maps/documentation/javascript/examples/places-searchbox


একই সমস্যা. এই কোড আর কাজ করে না।

আমি এটা সংশোধন করেছি, clearMarkers পদ্ধতি এই ভাবে পরিবর্তন:

set_map (নাল) ---> setMap (নাল)

google.maps.Map.prototype.clearMarkers = function() {
    for(var i=0; i < this.markers.length; i++){
        this.markers[i].setMap(null);
    }
    this.markers = new Array();
};

ডকুমেন্টেশনটি বিষয়টির বিশদ অন্তর্ভুক্ত করার জন্য আপডেট করা হয়েছে: https://developers.google.com/maps/documentation/javascript/markers#remove


এখানে আপনি মার্কারগুলি সরিয়ে ফেলার একটি উদাহরণ খুঁজে পেতে পারেন:

https://developers.google.com/maps/documentation/javascript/examples/marker-remove?hl=es

// Add a marker to the map and push to the array.
function addMarker(location) {
  var marker = new google.maps.Marker({
    position: location,
    map: map
  });
  markers.push(marker);
}

// Sets the map on all markers in the array.
function setAllMap(map) {
  for (var i = 0; i < markers.length; i++) {
    markers[i].setMap(map);
   }
}

// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
  setAllMap(null);
}

// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
  clearMarkers();
  markers = [];
}

নতুন সংস্করণ v3, তারা অ্যারে রাখা সুপারিশ। নিম্নলিখিত হিসাবে.

overlay-overview নমুনা দেখুন।

var map;
var markersArray = [];

function initialize() {
  var haightAshbury = new google.maps.LatLng(37.7699298, -122.4469157);
  var mapOptions = {
    zoom: 12,
    center: haightAshbury,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };
  map =  new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  google.maps.event.addListener(map, 'click', function(event) {
    addMarker(event.latLng);
  });
}

function addMarker(location) {
  marker = new google.maps.Marker({
    position: location,
    map: map
  });
  markersArray.push(marker);
}

// Removes the overlays from the map, but keeps them in the array
function clearOverlays() {
  if (markersArray) {
    for (i in markersArray) {
      markersArray[i].setMap(null);
    }
  }
}

// Shows any overlays currently in the array
function showOverlays() {
  if (markersArray) {
    for (i in markersArray) {
      markersArray[i].setMap(map);
    }
  }
}

// Deletes all markers in the array by removing references to them
function deleteOverlays() {
  if (markersArray) {
    for (i in markersArray) {
      markersArray[i].setMap(null);
    }
    markersArray.length = 0;
  }
}

ব্যবহারকারীদের আসল প্রশ্নের মূল প্রতিক্রিয়া অনুসারে প্রাথমিকভাবে ইংল্যাং মার্চ 11'14 এ 15: 049 এ পোস্ট করা সমস্ত সমাধানগুলির মধ্যে এটি সবচেয়ে সহজ ছিল

আমি গুগল ম্যাপস v3.18 এর সাথে 2.5 বছর পর একই সমাধান ব্যবহার করছি এবং এটি একটি কমনের মত কাজ করে

markersArray.push(newMarker) ;
while(markersArray.length) { markersArray.pop().setMap(null); }

// No need to clear the array after that.

মানচিত্র থেকে সমস্ত মার্কার মুছে ফেলার জন্য এমন কিছু তৈরি করুন:

1. অ্যাডমার্কার (অবস্থান): এই ফাংশনটি মানচিত্রে মার্কার যুক্ত করতে ব্যবহৃত হয়

2. স্পার্কমার্কারস (): এই ফাংশনটি ম্যাপ থেকে সমস্ত মার্কার মুছে ফেলবে, অ্যারে থেকে নয়

3.setMapOnAll (মানচিত্র): এই ফাংশন অ্যারে চিহ্নিতকারী তথ্য যোগ করতে ব্যবহৃত

4.deleteMarkers (): এই ফাংশন তাদের রেফারেন্স মুছে ফেলার মাধ্যমে অ্যারের সব চিহ্নিতকারী মুছে ফেলা।

// Adds a marker to the map and push to the array.
      function addMarker(location) {
        var marker = new google.maps.Marker({
          position: location,
          map: map
        });
        markers.push(marker);
      }


// Sets the map on all markers in the array.
      function setMapOnAll(map) {
        for (var i = 0; i < markers.length; i++) {
          markers[i].setMap(map);
        }
      }



// Removes the markers from the map, but keeps them in the array.
  function clearMarkers() {
    setMapOnAll(null);
  }

// Deletes all markers in the array by removing references to them.
      function deleteMarkers() {
        clearMarkers();
        markers = [];
      }


শুধু গুগল ম্যাপ সাফ করুন

mGoogle_map.clear();

শুধু চিহ্নিতকারীর উপর হাঁটুন এবং মানচিত্র থেকে সরান, তারপরে খালি মানচিত্র চিহ্নিতকারী অ্যারের পরে:

var markers = map.markers;
for(var i = 0; i < markers.length; i++) {
    markers[i].setMap(null);
}
map.markers = [];

সমাধান বেশ সহজ। আপনি পদ্ধতিটি ব্যবহার করতে পারেন: marker.setMap(map); । এখানে, আপনি পিন প্রদর্শিত হবে যা মানচিত্রে সংজ্ঞায়িত।

সুতরাং, যদি আপনি এই পদ্ধতিতে marker.setMap(null); সেট করেন ( marker.setMap(null); ), পিন অদৃশ্য হয়ে যাবে।

এখন, আপনি আপনার মানচিত্রে সমস্ত মার্কার অদৃশ্য করার সময় একটি ফাংশন ডাইরেক্ট লিখতে পারেন।

আপনি শুধু আপনার পিনগুলি একটি অ্যারের মধ্যে জুড়তে এবং markers.push (your_new pin) বা এই কোডটি দিয়ে তাদের ঘোষণা করুন যেমন:

// Adds a marker to the map and push to the array.
function addMarker(location) {
  var marker = new google.maps.Marker({
    position: location,
    map: map
  });
  markers.push(marker);
}

এটি একটি ফাংশন উইচ ম্যাপে আপনার অ্যারের সমস্ত চিহ্নিতকারীগুলিকে সেট বা অদৃশ্য করতে পারে:

// Sets the map on all markers in the array.
  function setMapOnAll(map) {
    for (var i = 0; i < markers.length; i++) {
      markers[i].setMap(map);
    }
  }

আপনার সমস্ত মার্কার অদৃশ্য করার জন্য, আপনাকে ফাংশনটি null দিয়ে কল করতে হবে:

// Removes the markers from the map, but keeps them in the array.
  function clearMarkers() {
    setMapOnAll(null);
  }

এবং, আপনার সমস্ত মার্কার মুছে ফেলার এবং অদৃশ্য করার জন্য, আপনাকে চিহ্নিতকারীদের আপনার অ্যারেটি পুনরায় সেট করা উচিত:

// Deletes all markers in the array by removing references to them.
  function deleteMarkers() {
    clearMarkers();
    markers = [];
  }

এই আমার সম্পূর্ণ কোড। এটা সহজে আমি কমাতে পারে। আপনার মূল গুগল এপিআই দ্বারা YOUR_API_KEY প্রতিস্থাপিত হতে পারে সম্পূর্ণ যত্ন নিন :

<!DOCTYPE html>
<html>
  <head>
  <title>Remove Markers</title>
  <style>
     /* Always set the map height explicitly to define the size of the div
     * element that contains the map. */
     #map {
       height: 100%;
       }
  </style>
</head>
<body>

<div id="map"></div>
<p>Click on the map to add markers.</p>
<script>

  // In the following example, markers appear when the user clicks on the map.
  // The markers are stored in an array.
  // The user can then click an option to hide, show or delete the markers.
  var map;
  var markers = [];

  function initMap() {
    var haightAshbury = {lat: 37.769, lng: -122.446};

    map = new google.maps.Map(document.getElementById('map'), {
      zoom: 12,
      center: haightAshbury,
      mapTypeId: 'terrain'
    });

    // This event listener will call addMarker() when the map is clicked.
    map.addListener('click', function(event) {
      addMarker(event.latLng);
    });

    // Adds a marker at the center of the map.
    addMarker(haightAshbury);
  }

   // Adds a marker to the map and push to the array.
  function addMarker(location) {
    var marker = new google.maps.Marker({
      position: location,
      map: map
    });
    markers.push(marker);
  }

  // Sets the map on all markers in the array.
  function setMapOnAll(map) {
    for (var i = 0; i < markers.length; i++) {
      markers[i].setMap(map);
    }
  }

  // Removes the markers from the map, but keeps them in the array.
  function clearMarkers() {
    setMapOnAll(null);
  }

  // Shows any markers currently in the array.
  function showMarkers() {
    setMapOnAll(map);
  }

  // Deletes all markers in the array by removing references to them.
  function deleteMarkers() {
    clearMarkers();
    markers = [];
  }

</script>
   <script async defer
    src="https://maps.googleapis.com/maps/api/js key=YOUR_API_KEY&callback=initMap">
   </script>
</body>
</html>

আপনি গুগল বিকাশকারী ওয়েব সাইটটি গুগল বিকাশকারী বা সম্পূর্ণ ডকুমেন্টেশন নিয়ে আলোচনা করতে পারেন।


for (i in markersArray) {
  markersArray[i].setMap(null);
}

শুধু IE কাজ করছে।

for (var i=0; i<markersArray.length; i++) {
  markersArray[i].setMap(null);
}

ক্রোম, ফায়ারফক্স, অর্থাত্ ...






google-maps-api-3