eduardolundgren / tracking.js

A modern approach for Computer Vision on the web
http://trackingjs.com
Other
9.43k stars 1.44k forks source link

tracker.stop() not stopping .on('track') from emitting #258

Closed Hoopstr42 closed 6 years ago

Hoopstr42 commented 6 years ago

When stop() is called the tracker is not stopping. Here is a simplified version of my code.

this.tracker = new tracking.ObjectTracker('face'); this.tracker.on('track', this._tracking.bind(this));

this.constraints = { audio: false, video: { width: {min: 640, ideal: 1280, max: 1280}, height: {min: 360, ideal: 720, max: 720}, facingMode: 'environment' }, camera: true };

this.myTracking = tracking.track(this.$.video, this.tracker, this.constraints);

_tracking: function(event) { console.log('tracking'); event.data.forEach(function(rect) { console.log('rect',rect); if(rect){ this.myTracking.stop(); } }.bind(this);

After stop is called the 'tracking' log entry continues to run. The only way I can get it to stop is to do this.$.video.src = ' '; Which crashes the tracking loop.

Hoopstr42 commented 6 years ago

tracking error

Hoopstr42 commented 6 years ago

tracking error

Hoopstr42 commented 6 years ago

This is a screen shot of the console log

tracking error

Hoopstr42 commented 6 years ago

This is a screen shot of the console log

tracking error

Hoopstr42 commented 6 years ago

This is a screen shot of the console log

tracking error

markos92i commented 6 years ago

This is happening to me too, and is annoying

jsprow commented 6 years ago

Same here. I'm running it in a React app and am able to stop the webcam from recording with videoElement.srcObject.getVideoTracks()[0].stop();, but when I myTracker.stop();, the tracker just keeps on going.

I can replicate the problem with:

tracker.on('track', ({ data }) => {
  myTracker.stop();
  console.log('...still tracking');
});

...aaaaaaannnnnd... screen shot 2018-03-29 at 5 34 51 pm

I tried tracing the issue through the source and am seeing a couple things:

When I log the myTracker object after it's "stopped", the property running_ is false, so... cool.

I looked at my performance tab after .stop() and there's a recurring requestAnimationFrame() that still hasn't stopped. I set a breakpoint at the function on line 1842 to try and track down the origin of the recurring function:

tracking.TrackerTask.prototype.stop = function() {
  if (!this.inRunning()) {
    return;
  }

  this.setRunning(false);
  this.emit('stop');
  this.tracker_.removeListener('track', this.reemitTrackEvent_);
  return this;
};

I stepped through all the function calls and eventually landed on line 273:

task.on('stop', function() {
  window.cancelAnimationFrame(requestId);
});

This should be canceling the requestAnimationFrame() from recurring, right?

I'll keep digging, but hopefully this shines a little light on what might be happening.

murat-aka commented 6 years ago

102

amilyhao commented 5 years ago

I still have this problem, tracker.stop() not stopping .on('track') from emitting

amilyhao commented 5 years ago

This is happening to me too, and is annoying

Excuse me,have this problem resolved.

amilyhao commented 5 years ago

When stop() is called the tracker is not stopping. Here is a simplified version of my code.

this.tracker = new tracking.ObjectTracker('face'); this.tracker.on('track', this._tracking.bind(this));

this.constraints = { audio: false, video: { width: {min: 640, ideal: 1280, max: 1280}, height: {min: 360, ideal: 720, max: 720}, facingMode: 'environment' }, camera: true };

this.myTracking = tracking.track(this.$.video, this.tracker, this.constraints);

_tracking: function(event) { console.log('tracking'); event.data.forEach(function(rect) { console.log('rect',rect); if(rect){ this.myTracking.stop(); } }.bind(this);

After stop is called the 'tracking' log entry continues to run. The only way I can get it to stop is to do this.$.video.src = ' '; Which crashes the tracking loop.

Excuse me,have this problem resolved.