惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

WordPress大学
WordPress大学
Recent Announcements
Recent Announcements
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Microsoft Azure Blog
Microsoft Azure Blog
S
Security @ Cisco Blogs
P
Proofpoint News Feed
博客园 - 三生石上(FineUI控件)
T
Tailwind CSS Blog
www.infosecurity-magazine.com
www.infosecurity-magazine.com
The Last Watchdog
The Last Watchdog
AI
AI
Webroot Blog
Webroot Blog
aimingoo的专栏
aimingoo的专栏
Hacker News: Ask HN
Hacker News: Ask HN
B
Blog RSS Feed
小众软件
小众软件
T
The Blog of Author Tim Ferriss
博客园 - 叶小钗
W
WeLiveSecurity
C
CXSECURITY Database RSS Feed - CXSecurity.com
H
Hackread – Cybersecurity News, Data Breaches, AI and More
T
Troy Hunt's Blog
云风的 BLOG
云风的 BLOG
P
Privacy International News Feed
Application and Cybersecurity Blog
Application and Cybersecurity Blog
Vercel News
Vercel News
Y
Y Combinator Blog
P
Proofpoint News Feed
V2EX - 技术
V2EX - 技术
AWS News Blog
AWS News Blog
F
Fortinet All Blogs
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
The GitHub Blog
The GitHub Blog
A
Arctic Wolf
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
Hugging Face - Blog
Hugging Face - Blog
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
V
V2EX
MongoDB | Blog
MongoDB | Blog
SecWiki News
SecWiki News
The Register - Security
The Register - Security
博客园_首页
T
Threat Research - Cisco Blogs
Hacker News - Newest:
Hacker News - Newest: "LLM"
Recorded Future
Recorded Future
V
Vulnerabilities – Threatpost
I
InfoQ
雷峰网
雷峰网
C
Check Point Blog

博客园 - 莫小龙

uniapp之plus.downloader.createDownload下载文件传参 谷歌之将网页保存为图片 elementui之table中相同数据的单元格合并 krpano之使用教程 threejs之灯光不跟随OrbitControls控制器旋转 threejs之将张纹理图片组成材质组 canvas之修改Base64图片中不透明部分的颜色 threejs之将PlaneGeometry转换为BufferGeometry threejs之添加渐变背景 threejs之创建发光墙体 paperjs之fitBounds适应区域前后屏幕坐标和输入坐标的转换 arcmap之通过点数据获取等值线 uniapp之安卓APP打开百度地图、高德地图APP openlayer之添加带箭头的线 geoserver之图片图标样式 SHP转WKT文件工具 openlayers之geoserver的wms图层mysql数据源数据修改后更新问题 通过日照时数计算每天RAD(太阳辐射)值 Uniapp之安卓签名证书(.keystore)生成
threejs之利用shape通过线绘制面和体
莫小龙 · 2025-06-20 · via 博客园 - 莫小龙

threejs之利用shape通过线绘制面和体

            var smileyShape = new THREE.Shape();
            smileyShape.moveTo(80, 40);
            smileyShape.absarc(40, 40, 40, 0, Math.PI * 2, false);// 主模型

            var smileyEye1Path = new THREE.Path();
            smileyEye1Path.moveTo(35, 20);
            smileyEye1Path.absellipse(25, 20, 10, 10, 0, Math.PI * 2, true);

            smileyShape.holes.push(smileyEye1Path);// 挖洞

            var smileyEye2Path = new THREE.Path();
            smileyEye2Path.moveTo(65, 20);
            smileyEye2Path.absarc(55, 20, 10, 0, Math.PI * 2, true);
            smileyShape.holes.push(smileyEye2Path);// 挖洞

            var smileyMouthPath = new THREE.Path();
            smileyMouthPath.moveTo(20, 40);
            smileyMouthPath.quadraticCurveTo(40, 60, 60, 40);
            smileyMouthPath.bezierCurveTo(70, 45, 70, 50, 60, 60);
            smileyMouthPath.quadraticCurveTo(40, 80, 20, 60);
            smileyMouthPath.quadraticCurveTo(5, 50, 20, 40);

            // smileyShape.holes.push(smileyMouthPath);// 挖洞
            // 创建面
            const geometryShape = new THREE.ShapeGeometry(smileyShape);
            // 拉伸厚度
            // const extrudeSettings = { depth: 10, bevelEnabled: false };
            // const geometryShape = new THREE.ExtrudeGeometry(smileyShape, extrudeSettings);
            const materialShape = new THREE.MeshBasicMaterial({
                color: 0x00ffff,
                side: THREE.DoubleSide,
                transparent: true,
                opacity: 0.5,
            });
            const smileymesh = new THREE.Mesh(geometryShape, materialShape);
            scene.add(smileymesh)

  效果:

。。。。。钻研不易转载请注明出处