0

我发现了这个很棒的代码示例,其中使用 p5js 和 tracking.js 跟踪颜色

https://kylemcdonald.github.io/cv-examples/ContourDetection-trackingjs/

如果我点击屏幕上的某个地方,我点击的颜色的每个点都会被跟踪。如果我再次点击其他地方,新颜色就会被跟踪。所以一次只能跟踪一种颜色。现在,如果我想一次跟踪几种颜色,我该怎么办?

这是源代码:

// https://kylemcdonald.github.io/cv-examples/

var capture;
var tracker;

var rhi, ghi, bhi;
var rlo, glo, blo;

function setTarget(r, g, b, range) {
    range = range || 32;
    rhi = r + range, rlo = r - range;
    ghi = g + range, glo = g - range;
    bhi = b + range, blo = b - range;
}

function setup() {
    var w = 640,
        h = 480;
    capture = createCapture({
        audio: false,
        video: {
            width: w,
            height: h
        }
    }, function() {
        console.log('capture ready.')
    });
    capture.elt.setAttribute('playsinline', '');
    capture.size(w, h);
    capture.parent('container');
    cnv = createCanvas(w, h);
    cnv.parent('container');
    // capture.hide(); // tracking.js can't track the video when it's hidden

    setTarget(255, 255, 255); // by default track white
    tracking.ColorTracker.registerColor('match', function (r, g, b) {
        if (r <= rhi && r >= rlo &&
            g <= ghi && g >= glo &&
            b <= bhi && b >= blo) {
            return true;
        }
        return false;
    });
    tracker = new tracking.ColorTracker(['match']);
    tracker.minDimension = 20; // make this smaller to track smaller objects
    capture.elt.id = 'p5video';
    tracking.track('#p5video', tracker, {
        camera: true
    });
    tracker.on('track', function (event) {
        cnv.clear();
        strokeWeight(4);
        stroke(255, 0, 0);
        noFill();
        event.data.forEach(function (r) {
            rect(r.x, r.y, r.width, r.height);
        })
    });
}

function draw() {
    if (mouseIsPressed &&
        mouseX > 0 && mouseX < width &&
        mouseY > 0 && mouseY < height) {
        capture.loadPixels();
        target = capture.get(mouseX, mouseY);
        setTarget(target[0], target[1], target[2]);
    }
}

我尝试在绘图中创建一个新目标和 setTarget,并尝试在设置中进行第二次跟踪,但没有任何效果。

也许有人可能知道该怎么做?

4

0 回答 0