87. 多边形轮廓Shape(圆弧)

先掌握上节课关于Shape内容,再继续学习本节课关于Shape圆弧的介绍。

圆弧方法.arc()

圆弧方法.arc()使用方式和原来学习过的圆弧曲线ArcCurve整体相似,区别在于圆心定位方式有差异。

圆弧.arc()参数的圆心坐标是相对当前.currentPoint而言,而不是坐标原点。

下面代码绘制了一个矩形+扇形的轮廓,圆心在(100, 0),半径50。

// 下面代码绘制了一个矩形+扇形的轮廓,圆心在(100, 0),半径50。
const shape = new THREE.Shape();
shape.lineTo(100+50, 0); //.currentPoint变为(100+50,0)
// 圆弧.arc参数的圆心0,0坐标是相对当前.currentPoint而言,而不是坐标原点
shape.arc(-50,0,50,0,Math.PI/2); //.currentPoint变为圆弧线结束点坐标
console.log('currentPoint',shape.currentPoint);
// 绘制直线,直线起点:圆弧绘制结束的点  直线结束点:(0, 0)
shape.lineTo(0, 50);

另一种写法:直线和圆弧起点之间的缺口threejs内部会自动补上

// 下面代码绘制了一个矩形+扇形的轮廓,圆心在(100, 0),半径50。
const shape = new THREE.Shape();
shape.lineTo(100, 0); //.currentPoint变为(100,0)
// 圆弧.arc参数的圆心0,0坐标是相对当前.currentPoint而言,而不是坐标原点
shape.arc(0,0,50,0,Math.PI/2); //.currentPoint变为圆弧线结束点坐标
console.log('currentPoint',shape.currentPoint);
// 绘制直线,直线起点:圆弧绘制结束的点  直线结束点:(0, 0)
shape.lineTo(0, 50);

Shape作为几何体参数

Shape有直线之外的曲线,如果默认渲染不光滑,可以设置参数2提升

// shape:填充轮廓  
const geometry = new THREE.ShapeGeometry(shape, 20);
const geometry = new THREE.ExtrudeGeometry(shape, {depth:20,//拉伸长度bevelEnabled:false,//禁止倒角curveSegments:20,//shape曲线对应曲线细分数
});

绝对圆弧方法.absarc()

.absarc()圆心坐标不受到.currentPoint影响,以坐标原点作为参考,这一点和圆弧方法.arc()不同。

下面代码绘制了一个矩形+扇形的轮廓,圆心在(100, 0),半径50。

const shape = new THREE.Shape();
shape.lineTo(100, 0); //.currentPoint变为(100,0)
// absarc圆心坐标不受到.currentPoint影响,以坐标原点作为参考
shape.absarc(100,0,50,0,Math.PI/2); //.currentPoint变为圆弧线结束点坐标
console.log('currentPoint',shape.currentPoint);
shape.lineTo(0, 50);

另一种写法:直线和圆弧起点之间的缺口threejs内部会自动补上

const shape = new THREE.Shape();
shape.lineTo(100+50, 0); //.currentPoint变为(100+50,0)
// absarc圆心坐标不受到.currentPoint影响,以坐标原点作为参考
shape.absarc(100,0,50,0,Math.PI/2); //.currentPoint变为圆弧线结束点坐标
console.log('currentPoint',shape.currentPoint);
shape.lineTo(0, 50);

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

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

相关文章

斜视角,视角和入射角

注意分辨率中的2 在;雷达的径向,分辨率(时间)就是脉冲宽度/2

SAP 控制生产订单发料数量不能超过生产订单预留数量

SAP 控制生产订单发料数量不能超过生产订单预留数量 业务场景前台操作1、创建生产订单---CO012、生产订单发料---MIGO3、系统后台配置业务场景 正常生产订单进行投料的根据生产订单组件进行投料,比如生产订单组件数量是100PCS,那在做工单发料的时候MIGO带出的默认发料数量就…

机器学习(MachineLearning)(8)——模型评估与优化

机器学习(MachineLearning)(1)——机器学习概述 机器学习(MachineLearning)(2)——线性回归 机器学习(MachineLearning)(3)——决策树…

Linux_进程控制

一&#xff1a;进程创建 fork()函数创建新进程 #include <unistd.h> pid_t fork(void); 返回值&#xff1a;自进程中返回0&#xff0c;父进程返回子进程id&#xff0c;出错返回-1 进程调用fork&#xff0c;当控制转移到内核中的fork代码后&#xff0c;内核做&#xff1a;…

Spring Boot Web框架:智慧社区设计新思路

4系统概要设计 4.1概述 本系统采用B/S结构(Browser/Server,浏览器/服务器结构)和基于Web服务两种模式&#xff0c;是一个适用于Internet环境下的模型结构。只要用户能连上Internet,便可以在任何时间、任何地点使用。系统工作原理图如图4-1所示&#xff1a; 图4-1系统工作原理…

cocos Creator + fairyGUI 快速入门

版本 Creator 3.8.x&#xff0c;FairyGUI 2022 大部分内容来自 https://en.fairygui.com/docs/sdk/creator 1.新建cocos项目&#xff0c;根目录运行 npm install --save fairygui-cc 引入 fairyGUI库 2.assets目录之外新建fairyGUI项目 3.fairyGUI中编辑UI 完成后发布到Creato…

uniapp,获取头部高度

头部自定义时候&#xff0c;设置获取安全区域&#xff0c;可以用 uni.getSystemInfoSync();接口。 <view class"statusBar" :style"{height:statusBarHeightpx}"> let SYSuni.getSystemInfoSync(); let statusBarHeightref(SYS.statusBarHeight) …

Python基础——类与对象

类与对象的理解&#xff1a; 在程序中我们将类看作是设计图纸&#xff0c;对象则是根据这个图纸生产的产品。面向对象编程就是使用对象编程&#xff0c;在类中我们定义成员属性和方法。 来看下面这个例子&#xff0c;创建student类&#xff0c;定义对象并对属性赋值。 class S…

解决linux服务器磁盘占满问题(详细,有效,100%解决)

应用场景&#xff1a; 在我们的日常开发中&#xff0c;我们的服务器总是在不知不觉中磁盘莫名奇妙少了很多空间&#xff0c;或者被占满了&#xff0c;如果这时候要想要存储什么文件&#xff0c;突然发现空间不够了。但我们通常也不知道那些文件占用的空间大&#xff0c;这时候…

Vue是一套构建用户界面的渐进式框架,常用于构建单页面应用

学习总结 1、掌握 JAVA入门到进阶知识(持续写作中……&#xff09; 2、学会Oracle数据库入门到入土用法(创作中……&#xff09; 3、手把手教你开发炫酷的vbs脚本制作(完善中……&#xff09; 4、牛逼哄哄的 IDEA编程利器技巧(编写中……&#xff09; 5、面经吐血整理的 面试技…

红黑树的理解与实现(详解)

相关的数据结构&#xff1a; 搜索二叉树-CSDN博客 AVL树的创建与检测-CSDN博客 个人主页&#xff1a;敲上瘾-CSDN博客 个人专栏&#xff1a;游戏、数据结构、c语言基础、c学习、算法 目录 一、红黑树规则&#xff1a; 二、红黑树的插入 1.变色 2.单旋变色 3.双旋变色 三、…

WebGoat SQL Injection (intro) 源码分析

首先了解 java 中 mysql 的连接&#xff1a;java连接Mysql WebGoat SQL Injection (intro) 10 根据提示&#xff1a;下面两个输入框只有一个受到 sql 注入攻击。题目要求是检索到所有数据 发现请求路径为 SqlInjection/assignment5b 定位到所在文件如下&#xff0c;根据代码…

【uniapp】使用Promise封装request

目录 1、创建config目录 2、创建settings.js 3、创建目录utils 4、创建request.js 5、创建api目录 6、创建apis.js文件 7、业务系统调用 7.1 业务系统banner 7.2 业务系统荣誉页面&#xff08;传参&#xff09; 前言&#xff1a;使用Promise封装request 1、创建config…

UNIX网络编程-传输层

概述 传输层主要包括&#xff1a;TCP、UDP、SCTP&#xff08;流控制传输协议&#xff09;&#xff01; 绝大多数客户端/服务器网络应用都使用TCP/UDP。SCTP是一个较新的协议&#xff0c;最初设计用于跨因特网传输电话信令。 这些传输协议都转而使用网络协议IP&#xff1a;或是…

2023年华为杯数学建模竞赛题F论文和代码

强对流降水临近预报建模与优化 对问题一&#xff0c;为了实现基于前一小时&#xff08;10帧&#xff09;的实测雷达观测量&#xff08;ZH、ZDR、KDP&#xff09;&#xff0c;对后续一小时&#xff08;10帧&#xff09;的ZH进行预报&#xff0c;本文首先建立了线性拟合与RMSE双驱…

matlab相位图

% 清空工作空间和命令窗口 clear; clc; % 模拟生成时间t&#xff0c;位移y(t)和角位移theta(t) t linspace(0, 100, 1000); % 时间从0到100&#xff0c;包含1000个点 y 1e-5 * sin(2 * pi * 0.1 * t) .* exp(-0.01 * t); % 位移y(t) 振荡衰减 theta 1e-6 * cos(2 * pi * …

Qt第十三天:网络编程:TCP和UDP的使用

我发现了有些人喜欢静静看博客不聊天呐&#xff0c; 但是ta会点赞。 这样的人呢帅气低调有内涵&#xff0c; 美丽大方很优雅。 说的就是你&#xff0c; 不用再怀疑哦 ❤️TCP&#xff1a; 一、创建项目&#xff0c;命名为Server&#xff0c;继承QWidget 二、添加Qt设计师…

如何进行数学家式的学习思考?

如何进行数学家式的学习思考&#xff1f; 学生阶段的数学学习是非常重要的&#xff0c;对这一点很少有人质疑。一提起数学学习&#xff0c;一些学生、家长甚至一些教师认为&#xff0c;学生的数学学习往往侧重于掌握基本概念、公式和解题技巧&#xff0c;通过做题来巩固知识和提…

【飞腾加固服务器】全国产化解决方案:飞腾FT2000+/64核,赋能关键任务保驾护航

在信息安全和自主可控的时代背景下&#xff0c;国产化设备的需求与日俱增&#xff0c;尤其是在国防、航空航天、能源和其他关键行业。高可靠性和极端环境设计的国产加固服务器&#xff0c;搭载强大的飞腾FT2000/64核处理器&#xff0c;全面满足国产自主可控的严苛要求。 性能强…

【Linux探索学习】第六弹——Linux的工具(一):Ubuntu系统下的软件包管理器

前言&#xff1a; 在Ubuntu系统中&#xff0c;Linux工具为用户提供了强大的命令行操作能力。这些工具不仅使日常任务的自动化成为可能&#xff0c;还大幅提升了生产力。本文将重点介绍一些常用的Linux工具&#xff1a;软件包管理器 注意&#xff1a;本文是所讲解的内容是在Ubun…