AABB
AlignmentBehavior
ArriveBehavior
AStar
BFS
BoundingSphere
BVH
BVHNode
Cell
CellSpacePartitioning
CohesionBehavior
CompositeGoal
ConvexHull
Corridor
CostTable
DFS
Dijkstra
Edge
EntityManager
EvadeBehavior
EventDispatcher
Behavior
FollowPathBehavior
FuzzyAND
FuzzyCompositeTerm
FuzzyFAIRLY
FuzzyModule
FuzzyOR
FuzzyRule
FuzzySet
FuzzyTerm
FuzzyVariable
FuzzyVERY
GameEntity
Goal
GoalEvaluator
Graph
GraphUtils
HalfEdge
HeuristicPolicyDijkstra
HeuristicPolicyEuclid
HeuristicPolicyEuclidSquared
HeuristicPolicyManhattan
InterposeBehavior
LeftSCurveFuzzySet
LeftShoulderFuzzySet
LineSegment
Logger
MathUtils
Matrix3
Matrix4
MemoryRecord
MemorySystem
MeshGeometry
MessageDispatcher
MovingEntity
NavEdge
NavMesh
NavMeshLoader
NavNode
Node
NormalDistFuzzySet
OBB
ObstacleAvoidanceBehavior
OffsetPursuitBehavior
OnPathBehavior
Path
Plane
Polygon
Polyhedron
PriorityQueue
PursuitBehavior
Quaternion
Ray
RectangleTriggerRegion
Regular
RightSCurveFuzzySet
RightShoulderFuzzySet
SAT
SeekBehavior
SeparationBehavior
SingletonFuzzySet
Smoother
SphericalTriggerRegion
State
StateMachine
SteeringBehavior
SteeringManager
Task
TaskQueue
Telegram
Think
Time
TriangularFuzzySet
Trigger
TriggerRegion
Vector3
Vehicle
Version
WanderBehavior

lineOfSightTest

描述

lineOfSightTest函数用于检查两个HTML元素之间是否存在遮挡关系,即一个元素是否可以看到另一个元素。该函数利用射线追踪技术,通过检测遮挡元素是否阻挡了两个元素之间的光线路径,来判断遮挡关系。

语法

yuka.Trigger.lineOfSightTest(sourceElement, targetElement)
  • sourceElement: HTMLElement,发起光线的起点元素
  • targetElement: HTMLElement,光线的终点元素

返回值

返回一个布尔值,表示两个元素之间是否存在遮挡关系。true表示不存在遮挡关系,false表示存在遮挡关系。

示例

<!DOCTYPE html>
<html>
<head>
    <title>lineOfSightTest</title>
    <script src="yuka.js"></script>
    <script>
        function test() {
            let sourceElement = document.getElementById("source");
            let targetElement = document.getElementById("target");
            let isLineOfSight = yuka.Trigger.lineOfSightTest(sourceElement, targetElement);
            console.log("Is there line of sight? " + isLineOfSight);
        }
    </script>
</head>
<body>
    <div id="source" style="width: 50px; height: 50px; background-color: #ff0000;"></div>
    <div id="obstacle" style="margin-top: 30px; width: 50px; height: 50px; background-color: #00ff00;"></div>
    <div id="target" style="margin-top: 30px; width: 50px; height: 50px; background-color: #0000ff;"></div>
    <button onclick="test()">Test</button>
</body>
</html>

在上述示例中,我们检测了四个元素之间的遮挡关系。按钮被点击时,会调用test函数,该函数会调用yuka.Trigger.lineOfSightTest函数来检测source和target之间是否存在遮挡关系。由于obstacle被放置在两个元素之间,因此可以预计该函数的返回值为false。

注意事项

  • 该函数需要传递两个HTML元素作为参数。这两个元素应当均存在于DOM树中。
  • 该函数只能用于检测一对元素之间的遮挡关系,无法检测多个元素之间的遮挡关系。
  • 尽管该函数使用了射线追踪技术,但得到的结果仍可能不完全准确,具体结果仍需根据实际情况进行调整。