leaflet realtime this._northEast未定义

Question

我正在地图上实施实时跟踪。它显示标记和边界非常好。但是经过一段时间后，标记会在leaflet.js中禁用并显示错误“this._northEast is undefined”。

我的代码如下：

var map = L.map('map-canvas').setView([78.4866,17.3850], 5);

  var openStreetMapsURL = ('https:' == document.location.protocol ? 'https://' : 'http://') +
  '{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
  var openStreetMapsLayer = new L.TileLayer(openStreetMapsURL,
  {attribution:'&copy;2014 <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'});

  // need to get your own bing maps key, http://www.microsoft.com/maps/create-a-bing-maps-key.aspx
  // var bingMapsLayer = new L.BingLayer("GetAKey");
  var googleMapsLayer = new L.Google('ROADMAP');
  var googleMapsSateliteLayer = new L.Google('HYBRID');
  // this fixes the zoom buttons from freezing
  // https://github.com/shramov/leaflet-plugins/issues/62
  L.polyline([[0, 0], ]).addTo(map);

  // this sets which map layer will first be displayed
  map.addLayer(googleMapsLayer);

  // this is the switcher control to switch between map types
  map.addControl(new L.Control.Layers({
  // 'Bing Maps':bingMapsLayer,
  'Google Maps':googleMapsLayer,
  'Satellite View':googleMapsSateliteLayer,
  //'OpenStreetMaps':openStreetMapsLayer
  }, {}));
  $('#loading').show();
  var shipLayer = L.layerGroup();
  var ships = L.icon({
  iconUrl: 'images/marker.png',
  iconSize: [16, 20]
  });
  var popup;
  var region;


  var realtime = L.realtime(

  function(success, error){
  var ship = mockShip();
  success(ship);
  }, {

  interval: refresh * 1000,
  getFeatureId: function(featureData){
  return featureData.properties.userName;
  },
  pointToLayer: function (feature, latlng) {region = '';


  if (typeof ship === "undefined" || ship === null){
  var title = feature.properties.userName + " - " + feature.properties.gpsTime;
  popup = L.popup()
  .setLatLng(latlng)
  .setContent(feature.properties.userName+'<br/>'+feature.properties.gpsTime+'<br/>BatteryInfo:'+feature.properties.batteryInfo+'%')
  .openOn(map);
  ships = L.icon({
  iconUrl: 'images/marker.png',
  iconSize: [16, 20]
  });
  marker = L.marker(latlng, {title: title, icon: ships});
  /*circle start*/
  if(typeof feature.properties.boundlatitude != "undefined" && typeof feature.properties.boundlongitude != "undefined" && feature.properties.boundradius != 0)
  {
  var fen = {lat:feature.properties.boundlatitude,lng:feature.properties.boundlongitude};
  //console.log(fen);
  var radius = feature.properties.boundradius;
  var region = L.circle(fen, radius, {
  color: 'red',
  fillColor: '#f03',
  fillOpacity: 0
  }).addTo(map);


  if(feature.properties.userName != 'default'){
  if (turf.distance(marker.toGeoJSON(), region.toGeoJSON()) * 1000 > radius) {

  $.ajax({
  url: 'outoffboundries.php',
  type: 'POST',
  data: { devid: feature.properties.deviceId,
  time: feature.properties.gpsTime,
  username: feature.properties.userName,
  longitude: feature.properties.longitude,
  latitude: feature.properties.latitude
  },
  async: false,
  success: function(data) {
  console.log(data);
  },
  error: function (xhr, status, errorThrown) {
  console.log("error status: " + xhr.status);
  console.log("errorThrown: " + errorThrown);
  }
  });
  }
  }
  }
  /*circle end*/
  marker.bindPopup(popup);

  marker.on('mouseover', function (e) {
  this.openPopup();
  });
  marker.on('mouseout', function (e) {
  this.closePopup();
  });
  marker.addTo(shipLayer);
  return marker;
  }
  }
  }).addTo(map);
  //controlLayers.addOverlay(geojson, 'Ships');

  realtime.on('update', function() {
  map.fitBounds(realtime.getBounds(), {maxZoom: 17});
  });
  var res;
  function mockShip() {
  var url = 'getallroutesforrealtimemap.php';

  $.ajax({
  url: url,
  type: 'GET',
  dataType: 'json',
  success: function(data) {
  res = data;
  },
  error: function (xhr, status, errorThrown) {
  console.log("status: " + xhr.status);
  console.log("errorThrown: " + errorThrown);
  }
  });//alert(res);

  return res;

  }