对象数组中的 Javascript 进程键

Question

我正在使用这个library 来跟踪我的网络摄像头流式传输的视频中的一些颜色。

返回被跟踪对象的代码很简单：

tracker.on('track', function(event) {
        
        console.log(event.data)

                  });

event.data 是一个对象数组，每个对象包含 5 个键 'color' , 'x' , 'y' , 'height' , 'width'，我要做的是找到 2 个它们的“X”相差 10 的对象，即 x1-x2=10 或 x2-x1=10 （我们称它们为相邻对象），已知event.data 随实时跟踪而变化，这不是静态数组。

尝试使用 jQuery .grep()，但无法弄清楚如何处理多个项目。

Answer 1

您只需要遍历数组并比较这些值：

for var i = 0; i < event.data.length; i++ )
{
    var data1 = event.data[ i ];

    //Now we'll loop through the whole array to compare
    for ( var x = 0; x < event.data.length; x++ )
    {
        if ( Math.abs( data1.x - event.data[ x ].x ) === 10 )
        {
            return { x1: data1, x2: event.data[ x ] };
        }
    }
}

Answer 2

我会这样做（Array.prototype.filter 和 $.grep() 做同样的事情）：

var events = [];
tracker.on('track', function(e){
    events.push(e.data);
});

function getEventsByXDiff(x){
    return events.filter(function(e){
        return e.x - x === 10 || x - e.x === 10
    });
}

// Usage: getEventsByXDiff(someEvent.x);

虚拟事件数据示例：http://jsfiddle.net/11mvLtqp/

Answer 3

我建议创建另一个容器数组来包含（真的吗？）跟踪器生成的所有数组：

var container = [];
tracker.on("track", function(event) {
    var newIndex = container.length;
    container[newIndex] = event.data;
    process(newIndex);
});

现在您已经保存了所有数据，您可以对其进行处理：

function process(index) {
    var adjacent = [];
    for(var i = 0; i < container.length; i++) {
        var subtract = container[index].x - container[i].x;
        if(subtract == 10 || subtract == -10)
          adjacent.push(i);
    }
    return adjacent;
}

所以现在，如果 process() 返回 true，你就知道差是 10。你现在用它做什么取决于你。