JS判断点是否在线段上的代码
更新时间:2023年11月17日 09:38:15 作者:唯之为之
这篇文章主要介绍了JS判断点是否在线段上的相关资料,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
说明
点积可以用来判断两个向量的夹角,如果这个夹角是0或者180度,说明这个点在直线上;叉积可以用来判断一个点到一条直线的距离,如果这个距离是0,说明这个点在直线上。
假设有a、b、c三点,其中a和b是线段的两个端点,c是要判断的点:
- 计算向量ab和ac的点积,记为dot。
- 如果dot小于0,说明c在ab的垂直平分线上;
- 如果dot等于ab的模长的平方,说明c在ab的延长线上;
- 如果dot在0和ab的模长的平方之间,说明c在ab的方向上,可能在ab线段上;
- 如果dot小于0或者大于ab的模长的平方,说明c不在ab的直线上,也不在ab线段上。
- 计算向量ab和ac的叉积,记为cross。
- 如果cross不等于0,说明c不在ab的直线上,也不在ab线段上;
- 如果cross等于0,说明c在ab的直线上。
- 当判断出c在ab的直线上时,还需要判断c的x坐标或者y坐标是否在a和b的x坐标或者y坐标之间,才能确定c是否在ab的线段上。
综合上面两个条件,叉积和点积都可以用来判断一个点是否在一条直线上,但是叉积更简单一些,因为它需要的条件更少。
JS代码
/** * 判断点c是否在ab组成的线段上 * @param {x,y} a 点 * @param {x,y} b 点 * @param {x,y} c 点 * @returns boolean */ function isPointOnLineSegment(a, b, c) { // 计算向量ab和ac的叉积 let crossProduct = (b.x - a.x) * (c.y - a.y) - (b.y - a.y) * (c.x - a.x); // 如果不等于0,说明不共线,直接返回false if (crossProduct !== 0) { return false; } // 否则,检查c点是否在ab线段的范围内 return ( Math.min(a.x, b.x) <= c.x && c.x <= Math.max(a.x, b.x) && Math.min(a.y, b.y) <= c.y && c.y <= Math.max(a.y, b.y) ); } // 测试 const a = {x:0,y:0} const b = {x:0,y:1} const c = {x:0,y:2} const d = {x:1,y:1} const e = {x:1,y:2} const f = {x:2,y:2} console.log(isPointOnLineSegment(a, c, b)); // true console.log(isPointOnLineSegment(a, f, d)); // true console.log(isPointOnLineSegment(c, f, e)); // true console.log(isPointOnLineSegment(a, b, c)); // false console.log(isPointOnLineSegment(a, f, c)); // false console.log(isPointOnLineSegment(a, c, f)); // false
到此这篇关于JS判断点是否在线段上的文章就介绍到这了,更多相关JS判断点是否在线段上内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
javascript游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
前两讲我告诉了大家如何使人物移动,那么今天我们就来看看如何实现仿《三国志曹操传》人物情景对话,感兴趣的朋友可以了解下,希望本文对你有所帮助2013-01-01
最新评论