Question

我正在使用Javascript Google Maps API v3创建一个地图，逐点构建多边形，点击地图。另外，我想制作我在用户点击的位置可以拖动的标记，以便他们能够编辑多边形的形状。

我按照这个例子：http://gmaps-samples-v3.googlecode.com/svn/trunk/poly/poly_edit.html 这正是我想要它做的事。

我的问题是，当我将标记拖动时，它在地图上变得不可见。我在jsbin中复制了错误，只是取消注释了标记为.setDraggable（true）的行以查看错误。 http://jsbin.com/pekuyavi/9/edit?js,output

有谁知道如何解决这个问题？

Answer 1

这个问题的根本原因似乎是地图的定义。你用过：

    position: latLng,

而不是

    center: latLng,

为什么在调用marker.setDraggable()时删除标记我无法理解。即使标记点击事件处理程序被注释掉，标记也会被删除！

更新即使只是从地图选项中评论position: latLng,也可以，因为稍后会使用map.panTo(latLng);设置地图中心。

Answer 2

你可以将这样的属性设置为标记

 var marker = new google.maps.Marker({
      position: e.latLng,
      map: map,
      draggable: false,
      title:'anytext'
  });

你可以删除以下从代码中删除标记的代码bcoz

  google.maps.event.addListener(marker, 'click', function () {
      marker.setMap(null);
      for (var i=0, I = markers.length; i < I && markers[i] != marker; i++);
      markers.splice(i, 1);
      path.removeAt(i);
    });

Answer 3

试试这个

$(document).ready(function (){
//   Initialize map
  var latLng = new google.maps.LatLng(-37.8142026, 144.963785);  
  var mapOptions = {
    zoom: 10,
    panControl: true,
    zoomControl: true,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.DEFAULT,
      position: google.maps.ControlPosition.TOP_LEFT
    },
    center: latLng,
    scaleControl: false,
    mapTypeControl: false,
    streetViewControl: false
  };

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




//   set up polygon creation
  var markers = [],
      path = new google.maps.MVCArray,
      poly = new google.maps.Polygon({
        strokeWeight: 3,
        fillColor: '#555FF'
      });

  poly.setMap(map);
  poly.setPaths(new google.maps.MVCArray([path]));

  google.maps.event.addListener(map, 'click', function (evt) {


    var maker = new google.maps.Marker({
      position: evt.latLng,
      map: map,
      draggable: true

    });

    markers.push(maker);

//     Add marker dragend listener to move the path to the marker
    google.maps.event.addListener(maker, 'dragend', function () {
      for (var i=0, I = markers.length; i < I && markers[i] != maker; i++);
      path.setAt(i, maker.getPosition());
    });
    path.insertAt(path.length, evt.latLng);
  });



});

启用拖动后，Javascript Google Maps v3标记将变为不可见

3 个答案: