【JavaScriptThreejs】判断路径在二维平面上投影的方向顺逆时针

原理分析

可以将路径每个连续的两点向量叉乘相加,根据正负性判断路径顺逆时针性
当我们计算两个向量的叉积时,结果是一个新的向量,其方向垂直于这两个向量所在的平面,并且其大小与这两个向量构成的平行四边形的面积成正比。这个新向量的方向由右手定则确定:如果你将右手的四指放在两个向量的方向上,让拇指指向叉积的方向,那么你的手指弯曲的方向就是两个向量的顺时针旋转方向。

当我们应用这个概念到路径的情况时,我们可以将相邻的路径点表示为向量,然后计算它们之间的叉积。这个叉积的 z 分量(如果我们将路径投影到 xy 平面上)可以告诉我们这两个向量之间的顺时针或逆时针关系。
在这里插入图片描述
由于threejs很多地方对凹凸多边形没有限制,可以在输入端限制凹三角或在计算中舍弃凹点

代码

import { Vector3 } from "three";/*** 判断向量是否为顺时针  返回值true逆时针  false 顺时针* @param {[Vector3]} path //vec3路径* @param {'x'|'y'|'z'} forword //基准* @returns */
export default function isClockwise(path, forword = 'z') {let sum = 0;const n = path.length;for (let i = 0; i < n; i++) {const current = path[i];const next = path[(i + 1) % n]; // 取下一个点,循环到第一个点// 计算当前点到下一个点的向量const vector = next.clone().sub(current);// 只考虑 xy 平面上的向量,忽略 z 分量vector.z = 0;// 叉积的 z 分量可以判断顺时针还是逆时针if (forword == 'z')sum += (current.x * next.y - next.x * current.y);else if (forword == 'x')sum += (current.z * next.y - next.z * current.y);else if (forword == 'y')sum += (current.x * next.z - next.x * current.z);/***如果业务需要 可以在这里判断sum大小变化确定 如果增或者减反向 则可判断这里出现凹点*/}// 如果 sum 大于 0,则路径是逆时针的;如果 sum 小于 0,则路径是顺时针的return sum > 0;
}

使用

使用isClick判断路径方向性,并转为顺时针
   let reverse = isClockwise(vertices)if (reverse) vertices.reverse()

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/640982.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MyBatisCodeHelperPro插件免激活安装

1、下载 MyBatisCodeHelperPro 插件包&#xff08;内部已经激活&#xff09; 链接: https://pan.baidu.com/s/1i2Nvlnaea92U1Jx5E8xJUA 提取码: jmms 2、安装&#xff0c;点开插件&#xff0c;选择本地安装&#xff0c;选择下载的MyBatisCodeHelper-Pro.zip即可完成安装。

面试十七、list和deque

一、 Deque Deque容器是连续的空间&#xff0c;至少逻辑上看来如此&#xff0c;连续现行空间总是令我们联想到array和vector,array无法成长&#xff0c;vector虽可成长&#xff0c;却只能向尾端成长&#xff0c;而且其成长其实是一个假象&#xff0c;事实上(1) 申请更大空间 (…

数据结构-循环队列和循环双端队列的多角度实现

文章目录 1. 循环队列的数组形式实现2. 循环队列的链表实现3. 循环双端队列的数组形式实现4. 循环双端队列的链表实现 在力扣的题面如下 1. 循环队列的数组形式实现 其实循环队列的数组形式只有下面要注意的点,只要掌握了下面的这几点,代码层面上就没有什么问题了 用数组模拟的…

图论基础知识 深度搜索(DFS,Depth First Search),广度搜索(BFS,Breathe First Search)

图论基础知识 学习记录自代码随想录 dfs 与 bfs 区别 dfs是沿着一个方向去搜&#xff0c;不到黄河不回头&#xff0c;直到搜不下去了&#xff0c;再换方向&#xff08;换方向的过程就涉及到了回溯&#xff09;。 bfs是先把本节点所连接的所有节点遍历一遍&#xff0c;走到下…

windows SDK编程 --- 消息(3)

前置知识 一、消息的分类 1. 鼠标消息 处理与鼠标交互相关的事件&#xff0c;比如移动、点击和滚动等。例如&#xff1a; WM_MOUSEMOVE: 当鼠标在窗口客户区内移动时发送。WM_LBUTTONDOWN: 当用户按下鼠标左键时发送。WM_LBUTTONUP: 当用户释放鼠标左键时发送。WM_RBUTTOND…

C语言--基础面试真题

1、局部变量和静态变量的区别 普通局部变量和静态局部变量区别 存储位置&#xff1a; 普通局部变量存储在栈上 静态局部变量存储在静态存储区 生命周期&#xff1a; 当函数执行完毕时&#xff0c;普通局部变量会被销毁 静态局部变量的生命周期则是整个程序运行期间&#…

Oracle 21 C 安装详细操作手册,并配置客户端连接

Oracle 21 C 安装详细操作手册 Win 11 Oracle 21C 下载&#xff1a; Database Software Downloads | Oracle 中国 云盘共享 链接&#xff1a;https://pan.baidu.com/s/12XCilnFYyLFnSVoU_ShaSA 提取码&#xff1a;nfwc Oracle 21C 配置与登陆&#xff1a; 开始菜单 NetMa…

熊猫电竞赏金赛系统源码 APP+H5双端源码附搭建教程下载

熊猫电竞赏金系统简介 熊猫电竞赏金电竞系统 赏金赛源码&#xff0c;用户通过平台打比赛&#xff0c;赢了获得奖金奖励&#xff0c; 金币赛、赏金赛、vip赛等种赛事 可开王者荣耀、和平精英比赛 支持1v1、单排、双排组、战队排等多种比赛模式 支持QQ区、微信区 游戏玩的好…

Android——log的记忆

1.Java的 backtrace(堆栈log) 上述是一个空指针异常&#xff0c;问题出现在sgtc.settings&#xff0c;所以属于客户UI问题。 2.WindowManager(管理屏幕上的窗口和视图层次结构) 3.ActivityManager(管理应用程序生命周期和任务栈)

mac上VMware fusion net模式无法正常使用的问题

更新时间&#xff1a;2024年04月22日21:39:04 1. 问题 环境&#xff1a; intel芯片的macbook pro VMware fusion 13.5.1 无法将“Ethernet0”连接到虚拟网络“/dev/vmnet8”。在这里显示这个之后&#xff0c;应该是vmnet8的网段发生了冲突&#xff0c;所以导致无法正常使用…

text-shadow详解

text-shadow详解 属性定义及使用说明 text-shadow是CSS3中用于给文本添加阴影效果的属性。它允许您为文本内容添加一个或多个阴影&#xff0c;以增强视觉效果&#xff0c;创建立体感或装饰性文字外观。 语法 text-shadow: h-shadow v-shadow blur-radius spread-radius col…

yolov5_深度学习模型训练程序的暂停与恢复

问&#xff1a; 为什么要中断yolov5模型的训练&#xff1f; 答&#xff1a; 训练数据量大且过程漫长&#xff0c;电脑总要休息的嘛 简单直说&#xff1a; 1. 暂停 &#xff1a; 键盘输入&#xff1a; ctrl c这里以从第二次迭代中断为例&#xff1a; 2. 恢复模型训练 &am…