javascript - 使用 OpenLayers 每隔 x 秒调用 ajax 方法后删除旧标记添加新标记

Question

我想使用 ajax 方法每 x 秒更改一次标记位置，但我面临 1 个问题，因为新标记正在添加到 OpenLayers，但旧标记没有从 OpenLayers 中删除。我想先删除旧标记，然后在更新的位置添加新标记。

  function ShowCurrentTime() {
      var obj = {};
      obj.device_id = $.trim($("\[id*=txtdevice_id\]").val());
      var marker;
      var mapOptions;
      $.ajax({
          url: "TRACKING.aspx/GetData",
          data: JSON.stringify(obj),
          type: "POST",
          dataType: "json",
          contentType: "application/json; charset=utf-8",
          success: function(data) {
              if (data.d != '') {
                  var lat = data.d\[1\];
                  var lng = data.d\[2\];
              }
              $.each(data, function(index, value) {
                  var zoom = 13;
                  var marker = new OpenLayers.Layer.Markers("Markers");
                  var lonLat = new OpenLayers.LonLat(lng, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
                  map.addLayer(marker);
                  map.removeLayer(marker);
                  marker.addMarker(new OpenLayers.Marker(lonLat));
                  map.setCenter(lonLat, zoom);
              });
          }
      });
  }

标签： javascriptajaxopenlayersopenstreetmap

Answer 1

您在 ajax 中再次初始化标记，先删除然后再次初始化

这应该工作

function ShowCurrentTime() {
      var obj = {};
      obj.device_id = $.trim($("\[id*=txtdevice_id\]").val());
      var marker = null;
      var mapOptions;
      $.ajax({
          url: "TRACKING.aspx/GetData",
          data: JSON.stringify(obj),
          type: "POST",
          dataType: "json",
          contentType: "application/json; charset=utf-8",
          success: function(data) {
              if (data.d != '') {
                  var lat = data.d\[1\];
                  var lng = data.d\[2\];
              }
              $.each(data, function(index, value) {
                  var zoom = 13;
                  if (marker != null) map.removeLayer(marker);
                  marker = new OpenLayers.Layer.Markers("Markers");
                  var lonLat = new OpenLayers.LonLat(lng, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
                  map.addLayer(marker);
                  marker.addMarker(new OpenLayers.Marker(lonLat));
                  map.setCenter(lonLat, zoom);
              });
          }
      });
  }