Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/68.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 测试div列表是否与特定div重叠的有效方法_Javascript_Jquery_Leap Motion - Fatal编程技术网

Javascript 测试div列表是否与特定div重叠的有效方法

Javascript 测试div列表是否与特定div重叠的有效方法,javascript,jquery,leap-motion,Javascript,Jquery,Leap Motion,假设我有一个特定的div(目标),我可以使用输入设备四处移动(在我的例子中,div使用跳跃动作根据我手指的位置移动),我想知道div何时与页面上的其他div(障碍物)重叠 我已经编写了一个简单的函数来测试两个div重叠的情况,如果页面上只有几个障碍div,我们可能可以使用该函数测试页面上的所有障碍div,而不是目标div。但是,当页面上有很多项时,这可能会很快变得昂贵,特别是如果我们在每次滴答声中调用函数(Leap Motion每秒调用函数60次) 我想知道我们可以用什么方法来加速这个过程?我考

假设我有一个特定的div(目标),我可以使用输入设备四处移动(在我的例子中,div使用跳跃动作根据我手指的位置移动),我想知道div何时与页面上的其他div(障碍物)重叠

我已经编写了一个简单的函数来测试两个div重叠的情况,如果页面上只有几个障碍div,我们可能可以使用该函数测试页面上的所有障碍div,而不是目标div。但是,当页面上有很多项时,这可能会很快变得昂贵,特别是如果我们在每次滴答声中调用函数(Leap Motion每秒调用函数60次)

我想知道我们可以用什么方法来加速这个过程?我考虑a)由于页面上的障碍div不移动,我们可以只计算一次障碍div的坐标,然后缓存结果,而不是每次调用时重新计算;b)我们可以将障碍div建模为按x坐标排序的二叉树。这样,我们不需要测试所有障碍物div,只需要测试移动div附近的障碍物div

我只是想问有没有更好的方法

function overlapHelper($obj, $obstacle) {
  var xAxisOverlapping, yAxisOverlapping;

  var $objCoordinates = {
    left: parseInt($obj.css('left'), 10),
    top: parseInt($obj.css('top'), 10),
    right: parseInt($obj.css('left'), 10) + $obj.width(),
    bottom: parseInt($obj.css('top'), 10) + $obj.height()
  };

  var $obstacleCoordinates = {
    left: parseInt($obstacle.css('left'), 10),
    top: parseInt($obstacle.css('top'), 10),
    right: parseInt($obstacle.css('left'), 10) + $obstacle.width(),
    bottom: parseInt($obstacle.css('top'), 10) + $obstacle.height()
  }


  xAxisOverlapping = ($objCoordinates.left >= $obstacleCoordinates.left && $objCoordinates.left <= $obstacleCoordinates.right)
    || ($objCoordinates.right >= $obstacleCoordinates.left && $objCoordinates.right <= $obstacleCoordinates.right);


  yAxisOverlapping = ($objCoordinates.bottom >= $obstacleCoordinates.top && $objCoordinates.bottom <= $obstacleCoordinates.bottom)
    || ($objCoordinates.top >= $obstacleCoordinates.top && $objCoordinates.top <= $obstacleCoordinates.bottom);

  return xAxisOverlapping && yAxisOverlapping;
}
函数重叠帮助器($obj,$birder){
var Xaxis重叠,Yaxis重叠;
变量$objCoordinates={
左:parseInt($obj.css('left'),10),
top:parseInt($obj.css('top'),10),
右:parseInt($obj.css('left'),10)+$obj.width(),
底部:parseInt($obj.css('top'),10)+$obj.height()
};
变量$obstaclecordinates={
左:parseInt($barrier.css('left'),10),
top:parseInt($barrier.css('top'),10),
右:parseInt($barrier.css('left'),10)+$barrier.width(),
底部:parseInt($barrier.css('top'),10)+$barrier.height()
}

xAxisOverlapping=($objCoordinates.left>=$obstacleCoordinates.left&&$objCoordinates.left=$obstacleCoordinates.left&&&$objCoordinates.right=$obstacleCoordinates.top&&$objCoordinates.top=$obstacleCoordinates.top&&$objCoordinates.top您的需求似乎与此类似:


除了来自链接的信息外,如果障碍物div的数据来自脚本中的某个地方,您可以尝试在那里缓存这些值,并将DOM访问权限降至最低。

谢谢,这很有帮助!