Question

我正在构建一个跟踪应用程序，它从经常更新的数据库中获取位置，并将最后更新的数据作为标记。我在每秒调用的间隔中使用ajax调用来检索实时更新数据。

 $.ajax({
     type: "POST",
     async:false,
     dataType: "json",
     url: "{{ url('/tracking_mysql/bt6pmSWHTfnOAjfJMlSvRQ==') }}",
     success: function(data)
     {
      @foreach($eventUsers as $eventUser)
        markers['marker' + '{{$eventUser->userId}}'] = null ;
      @endforeach
      $.each(data,function(u,v){
      markers['marker' + v['user_id']] = new google.maps.LatLng(v['Location'].split(' ')[0],v['Location'].split(' ')[1]);
     lastUpdatedTimes['lastUpdatedTime' + v['user_id']] = v['time'];
   });
  }
});

并且传递当前位置的控制器是：

 public function get_locations($eventid)
    {
            $eventId = $event_group_Idarray[0];
            $locations = DB::table('locations')
                ->select('time', 'Location','user_id')
                ->join(DB::raw('( SELECT MAX(id) as Id FROM locations GROUP BY user_id ) AS newest'), function($join)
                {
                    $join->on('locations.id', '=', 'newest.id');
                })
                ->where('event_id',$eventId)
                ->get();

            print_r(json_encode($locations));
    }

问题是在每个ajax调用期间，地图更新会冻结片刻。我确定问题是在间隔中使用ajax调用。我评论了ajax调用并在间隔中传递了随机标记，地图是平滑的。。有什么解决方案可以用于我的目的吗？

Answer 1

这种情况正在发生，因为您正在使用同步Ajax调用。尝试异步Ajax调用。

＆＃13;

var jqAjax = null;

function updateMap() {
	//this will abort old pending request
	jqAjax && jqAjax.abort();
	
	jqAjax = $.ajax({
		type: "POST",
		dataType: "json",
		url: "{{ url('/tracking_mysql/bt6pmSWHTfnOAjfJMlSvRQ==') }}",
		success: function(data) {@
			foreach($eventUsers as $eventUser)
			markers['marker' + '{{$eventUser->userId}}'] = null;@
			endforeach
			$.each(data, function(u, v) {
				markers['marker' + v['user_id']] = new google.maps.LatLng(v['Location'].split(' ')[0], v['Location'].split(' ')[1]);
				lastUpdatedTimes['lastUpdatedTime' + v['user_id']] = v['time'];
			});
		}
	});
}

＆＃13;

Answer 2

有一件事我想建议使用带有Ajax调用的“cache：true”参数，这可能会减少一些性能问题（它不会完全减少，但有助于减少）。< / p>

间隔中的Ajax调用会降低地图

2 个答案: