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

devtools/2024/9/19 15:11:54/ 标签: javascript, 平面, 开发语言

原理分析

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

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

代码

javascript">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判断路径方向性,并转为顺时针
javascript">   let reverse = isClockwise(vertices)if (reverse) vertices.reverse()

http://www.ppmy.cn/devtools/22207.html

相关文章

python笔记:gensim进行LDA

理论部分&#xff1a;NLP 笔记&#xff1a;Latent Dirichlet Allocation &#xff08;介绍篇&#xff09;-CSDN博客 参考内容&#xff1a;DengYangyong/LDA_gensim: 用gensim训练LDA模型&#xff0c;进行新闻文本主题分析 (github.com) 1 导入库 import jieba,os,re from ge…

什么?你还不懂文件系统和软硬链接?

文章目录 序言认识磁盘磁盘在系统中的管理熟悉磁盘各个分区 软硬链接软链接硬链接 序言 首先熟悉一下一些专有名词(了解即可,但必须有一个概念认识) 固态:SSD,笔记本中常装的,台式机中也可以装,常见的对应接口M.2和SATA接口 磁盘:90年代常用的数据存储设备,或是现在企业级数据…

PotatoPie 4.0 实验教程(23) —— FPGA实现摄像头图像伽马(Gamma)变换

为什么要进行Gamma校正 图像的 gamma 校正是一种图像处理技术&#xff0c;用于调整图像的亮度和对比度&#xff0c;让显示设备显示的亮度和对比度更符合人眼的感知。Gamma 校正主要用于修正显示设备的非线性响应&#xff0c;以及在图像处理中进行色彩校正和图像增强。 以前&am…

Paddle OCR v4 微调训练文字识别SVTRNet模型实践

文字识别步骤参考&#xff1a;https://github.com/PaddlePaddle/PaddleOCR/blob/main/doc/doc_ch/recognition.md 微调步骤参考:https://github.com/PaddlePaddle/PaddleOCR/blob/release/2.7.1/doc/doc_ch/finetune.md 训练必要性 原始模型标点符号和括号容易识别不到 数据…

IPD项目管理体系的建立以及项目管理软件如何助力IPD高效落地

市场竞争的加剧与客户需求的多样性&#xff0c;传统的研发管理模式已无法满足企业发展的进程&#xff0c;IPD作为一种先进的研发管理思想与方法已被更多的企业所采用&#xff0c;用以提高研发效率。建立一个高效的IPD流程管理体系对于企业的发展至关重要。 接下来&#xff0c;…

Shader实战(3):贴图像素化风格实现

话不多说&#xff0c;将以下shader赋给材质贴上贴图即可。 Shader "HQY/Shader2" //自己改名 {Properties{_Diffuse ("Diffuse", Color) (1,1,1,1)_MainTex ("MainTex", 2D) "white" {}_Specular("Specular", Color) (…

mac M2 配置item2 rzsz

背景 apple m 系列处理器安装的 homebrew 跟 intel 处理器略有不同&#xff0c;其中安装目录的区别&#xff1a; m 系列处理器安装目录为 /usr/local/bin/homebrew intel 处理器安装目录为 /opt/homebrew 问题1: 卡住 产生原因&#xff1a; m 系列使用 brew install lrzs…

直接用表征还是润色改写?LLM用于文生图prompt语义增强的两种范式

直接用表征还是润色改写&#xff1f;LLM用于文生图prompt语义增强的两种范式 导语 目前的文生图模型大多数都是使用 CLIP text encoder 作为 prompt 文本编码器。众所周知&#xff0c;由于训练数据是从网络上爬取的简单图文对&#xff0c;CLIP 只能理解简单语义&#xff0c;而…

electron退出时添加一个包含“不再提示”选项的确认对话框

在 Electron 中添加一个包含“不再提示”选项的确认对话框可以通过 checkboxLabel 和 checkboxChecked 属性在 dialog.showMessageBox 函数中实现。这两个属性分别用于设置复选框的标签和初始状态。您可以根据用户的选择来决定是否在将来再显示此对话框。 以下是一个更新的示例…

redis基于Stream类型实现消息队列,命令操作,术语概念,个人总结等

个人大白话总结 1 在Redis Stream中&#xff0c;即使消息被消费者确认&#xff08;acknowledged, ACK&#xff09;&#xff0c;消息也不会自动从Stream数据结构中删除。这与Kafka或RabbitMQ等传统消息队列系统的做法不同&#xff0c;在那些系统中&#xff0c;一旦消息被消费并…

buuctf——[CISCN2019 华北赛区 Day2 Web1]Hack World

buuctf——[CISCN2019 华北赛区 Day2 Web1]Hack World 1.根据提示&#xff0c;说明flag在表里 2.那就猜测存在sql注入&#xff0c;反手测试一波id1 3.尝试使用1--进行注释 4.直接丢进salmap里吧&#xff0c;不出意外多半是跑不出来 5.直接放入fuzz里进行测试 6.发现当我…

经典的目标检测算法有哪些?

一、经典的目标检测算法有哪些&#xff1f; 目标检测算法根据其处理流程可以分为两大类&#xff1a;One-Stage&#xff08;单阶段&#xff09;算法和Two-Stage&#xff08;两阶段&#xff09;算法。以下是一些经典的目标检测算法&#xff1a; 单阶段算法: YOLO (You Only Loo…

关于腾讯云ocr银行卡识别报错url_1.URL is not a constructor

使用腾讯云进行ocr银行卡识别报错url_1.URL is not a constructor的问题各位怎么解决的能否留言告知一二 在线代码调试可以&#xff0c;但是js使用报错url_1.URL is not a constructor export function ocr(dataUrl){//dataUrl已转换为base64// Depends on tencentcloud-sdk-n…

PINN物理信息网络 | 利用物理信息神经网络进行流体动力学建模

背景 物理信息神经网络(Physics-Informed Neural Networks,PINN)是一种结合了神经网络和物理方程的方法,用于建模和求解物理问题。传统的基于物理方程的数值方法在处理复杂的非线性偏微分方程时可能面临数值稳定性、高计算复杂度和网格依赖性等问题。而PINN作为一种数据驱…

安全运营之通行字管理

一、什么是通行字 安全管理所指的通行字指的是对用于身份验证的账号密码或口令的管理。在计算机系统、网络服务、数据库管理等领域&#xff0c;通行字&#xff08;或称账号口令、密码&#xff09;是用于验证用户身份的重要机制。通行字管理的核心目标是确保只有授权用户才能访…

idea的macOS Apple Silicon (dmg)版本和macOS (dmg)版本有什么区别

“macOS Apple Silicon (dmg)” 版本则是专门为使用 Apple Silicon 芯片的 Mac 设备而设计的版本。 区别通常在于目标硬件平台和优化程度&#xff1a; 目标硬件平台&#xff1a;macOS Apple Silicon 版本是专门为基于 Apple Silicon 芯片的 Mac 设备&#xff08;例如 M1、M1 P…

tfrecord文件介绍、读取、写入介绍

1、tfrecord文件格式介绍 tfrecord文件格式&#xff0c;是深度学习框架tensorflow专用的一种文件格式&#xff0c;其底层使用protobuf&#xff0c;TensorFlow(python)也提供了api用于读取和写入tfrecord&#xff0c;非常方便&#xff0c;而对于golang语言&#xff0c;目前没有成…

Eureka服务注册与发现

Eureka服务注册与发现 概念原理Eureka的基本架构Eureka包含两个组件&#xff1a;Eureka Server和Eureka Client 三大角色目前工程情况 构建步骤step1&#xff1a;EurekaServer服务注册中心Module的建立step2&#xff1a;将已有的微服务注册进eureka服务中心actuator与注册微服务…

人机交互系统文本分类 text classification环节源码(E-commerce)

我把pre-trained model 下载到了本地 效果如下&#xff08;到时候把代码中的sequence 和labels换成自己的text和分类就行了。&#xff09;&#xff1a; 源码见链接&#xff1a; https://download.csdn.net/download/qqqweiweiqq/89211553

blender Principled Hair BSDF

三种模式&#xff1a; Direct Coloring 直接指定所需的RGB颜色值着色器会尝试近似所需的吸收系数来模拟该颜色Melanin Concentration 使用更加物理化的方式定义头发/毛发颜色通过指定黑色素(Melanin)的浓度和黑红色素(Pheomelanin/Eumelanin)的比例来确定颜色更符合头发/毛发中…