Javascript 获取详细信息，但无法删除_Javascript_Google Maps_Google Maps Api 3

Javascript 获取详细信息，但无法删除

javascript google-maps google-maps-api-3

Javascript 获取详细信息，但无法删除,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我在一个地方搜索中找到了marker调用marker，并在google map v3上抓取了它的getDetails。地点内搜索： <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <style>

我在一个地方搜索中找到了marker调用marker，并在google map v3上抓取了它的getDetails。地点内搜索：

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>

      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px;
        width: 1500px;
        margin-left: auto;
        margin-right: auto;
      }

    </style>
    <title>Places search box</title> 

    <script type='text/javascript' src='sortable/ext/jquery-1.9.1.js'></script>
    <script type="text/javascript" src="sortable/ext/jquery-ui.js"></script>


    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=places"></script>

    <script>
    var markers = [];

    var map;

    var marker;

function initialize() {

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    //CAN REVIEW FOR CURRENT LOCATION
    var mapOptions = {
        zoom: 8,
        mapTypeId: 'roadmap'
    };

    var defaultBounds = new google.maps.LatLngBounds(
        new google.maps.LatLng(0, 0));
    map.fitBounds(defaultBounds);

    // Create the search box and link it to the UI element.
    var input = /** @type {HTMLInputElement} */(
        document.getElementById('pac-input'));
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

    var searchBox = new google.maps.places.SearchBox(
    /** @type {HTMLInputElement} */(input));

    // [START region_getplaces]
    // Listen for the event fired when the user selects an item from the
    // pick list. Retrieve the matching places for that item.
    google.maps.event.addListener(searchBox, 'places_changed', function() {
        var places = searchBox.getPlaces();

        //Taking input into array
        var item = document.getElementById("pac-input");

    if (places.length == 0) {
        return;
    }

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

        map.setZoom(8);

    }
    this.markers = new Array();
    markers.length = 0;
    }
    // For each place, get the icon, place name, and location.
    markers = [];

    var bounds = new google.maps.LatLngBounds();
    for (var i = 0, place; place = places[i]; i++) {

      // Create a marker for each place.

        var marker = new google.maps.Marker({
            place_id: place.place_id
        });


        //Infowindow
        var infowindow = new google.maps.InfoWindow({
              //content: content
          });

        //Details Services
        var request = {
            placeId: marker.place_id
        };

        service = new google.maps.places.PlacesService(map);

        service.getDetails(request, function(place, status) {
            if (status == google.maps.places.PlacesServiceStatus.OK) {
              var marker = new google.maps.Marker({
                map: map,
                position: place.geometry.location
              });
              google.maps.event.addListener(marker, 'click', function() {

                infowindow.setContent(place.name);

                infowindow.open(map, this);
              });
            }
          });

        markers.push(marker);
        //searchmarkers.push(marker);

        bounds.extend(place.geometry.location);
    }

    map.fitBounds(bounds);
    //map.fitBounds(places[0].geometry.viewport);
    map.setZoom(12);
  });
// [END region_getplaces]
}


google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
        <input id="pac-input" class="controls" type="text" placeholder="Search Box">

    <div id="map-canvas" class="dropit" style="float:left;width:70%;height:100%;"></div>

  </body>
</html>


html，正文，#地图画布{
身高：100%；
边际：0px；
填充：0px；
宽度：1500px；
左边距：自动；
右边距：自动；
}
位置搜索框
var标记=[]；
var映射；
var标记；
函数初始化（）{
var map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
//可以查看当前位置
变量映射选项={
缩放：8，
mapTypeId:“路线图”
};
var defaultBounds=new google.maps.LatLngBounds(
新的google.maps.LatLng（0,0））；
map.fitBounds（defaultBounds）；
//创建搜索框并将其链接到UI元素。
变量输入=/**@type{HTMLInputElement}*/(
document.getElementById（'pac-input'）；
map.controls[google.maps.ControlPosition.TOP_LEFT].push（输入）；
var searchBox=new google.maps.places.searchBox(
/**@type{HTMLInputElement}*/（输入））；
//[开始区域\u getplaces]
//侦听当用户从中选择项目时激发的事件
//选择列表。检索该项目的匹配位置。
google.maps.event.addListener（搜索框，'places_changed'，函数（）{
var places=searchBox.getPlaces（）；
//将输入放入数组
var item=document.getElementById（“pac输入”）；
如果（places.length==0）{
返回；
}
//for（var i=0，marker；marker=markers[i]；i++）{
google.maps.Map.prototype.clearMarkers=函数（）{
对于（var i=0；i


我没有复制所有的代码，所以看起来有点失真。我的问题是每次我进行位置搜索时，它都可以正常工作。但是如果我进行其他位置搜索..它会堆叠。我似乎无法从getDetails中删除现有标记
我删除了标记。按（标记）；
它仍在添加标记，无法删除
建议
编辑：
更新了代码。
请注意，getDetails还显示了一组标记，我无法删除这些标记。
我从搜索框中删除了最初的标记…但我需要位置Id，所以我保留了它以用于getDetails
请帮助删除所有标记
编辑2：
谢谢geocodezip。请使用他创建的小提琴进行调试…似乎仍然无法使其工作
请注意如何搜索两个不同的内容，剩余内容仍然会出现。
您的代码中有语法错误。下面的代码片段中有工作版本。向映射对象添加了标记和边界，您不必这样做，但需要保持一致

var映射；
google.maps.Map.prototype.clearMarkers=函数（）{
如果（this.markers&&this.markers.length>0）{
对于（var i=0；i