three.js

小兔崽子去哪了1 天前
three.js
Three.js 曲线父类是:Curve获取点的方法getPoints按曲线参数 t(0→1)等分取点,当曲线弯曲程度不同、斜率变化较快的地方,会密集取点,参数空间等分
Keepreal4962 天前
javascript·vue.js·three.js
使用 Three.js 和 GSAP 动画库实现3D 名字抽奖通过 Three.js 和 GSAP 的结合使用,创造一个引人入胜的 3D 抽奖体验,特别是中奖结果展示环节的动画效果,使整个抽奖过程更加令人期待。
Jedi Hongbin3 天前
前端·javascript·three.js·nodematerial
Three.js NodeMaterial 节点材质系统文档目前没有正式版本文档 可以clone源码然后执行dev命令 访问 http://localhost:8080/docs_new/RangeNode.html 访问/docs_new 目录即可访问节点材质的文档
入秋3 天前
前端·javascript·three.js
Three.js后期处理实战:噪点 景深 以及色彩调整点赞 + 收藏 = 👍²设置基本的后期处理环境
答案answer3 天前
前端·性能优化·three.js
你不知道的Three.js性能优化和使用小技巧在使用Three.js开发实际项目的过程中,性能二字永远是一个绕不开的话题,相较于传统的前端业务,3D相关的项目对于性能方面一定是有更高要求的,除开three.js本身提供的性能优化方案之外,作者也在three.js的实际项目开发过程中总结出来一些自己的优化方案和开发小技巧。
爱看书的小沐4 天前
javascript·vue·webgl·three.js·航班·航迹·飞行轨迹
【小沐学WebGIS】基于Three.JS绘制飞行轨迹Flight Tracker(Three.JS/ vue / react / WebGL)https://threejs.org/Three.js 是一个基于 WebGL 的开源 JavaScript 库,用于在浏览器中创建和展示 3D 图形。它由 Ricardo Cabello(也称为 Mr.doob)于 2010 年创建,旨在简化 WebGL 的复杂性,使开发者能够轻松创建 3D 场景和交互式内容。
小兔崽子去哪了7 天前
three.js
Three.js 学习记录入门Three.js的第一步,就是认识场景Scene、相机Camera、渲染器Renderer三个基本概念
Demoncode_y7 天前
前端·javascript·vue.js·3d·汽车·three.js
Vue3 + Three.js 实现 3D 汽车个性化定制及展示在现代web开发中,3D可视化技术正变得越来越流行,特别是在汽车、房地产等行业。本文将详细介绍如何使用Vue 3和Three.js构建一个交互式3D汽车展示系统,实现汽车模型的360°旋转查看、部位选择、颜色定制和材质切换等功能。
Mintopia12 天前
前端·three.js·cesium
Cesium-kit 又发新玩意儿了:CameraControl 相机控制组件全解析工程师的浪漫,是把一行滑块拖出银河系。 研究者的浪漫,是把相机姿态写进秩序里。 今天,我们把这两种浪漫打包进一个组件里:CameraControl。📦✨
Mintopia14 天前
前端·three.js·cesium
🌍 cesium-kit —— 快速实现动态标点与交互的 Cesium 工具库cesium-kit 是一个开源的 Cesium 组件工具库, 由 leongaooo 基于 TypeScript 开发,提供一系列即插即用的函数与工具。 它能帮助开发者在 Cesium 场景中快速完成 绘制、标注和交互 ✨。
答案answer14 天前
前端·程序员·three.js
历时180多天,浅谈我对自由职业的初次探索其实在经历企业裁员,失业 ,AI编码工具,996 ,无偿加班 这些关键词之前,我从来都没有想过有一天自己会和自由职业这四个字挂钩,因为在此之前我的职业规划一直都是:去一家自己理想的企业(良好的工作氛围和没有严重的加班文化),然后在这家企业稳扎稳打通过自己的努力做出好的项目产品,给企业创造价值从而实现自我价值。
YAY_tyy14 天前
前端·javascript·3d·教程·three.js
Three.js 开发实战教程(四):相机系统全解析与多视角控制在前几篇教程中,我们通过灯光与阴影提升了场景真实感,但如何 “观察” 场景同样关键 —— 这正是相机系统的核心作用。Three.js 提供了多种相机类型,不同相机决定了场景的呈现视角(如人眼透视、工程图纸正交)。本篇将系统讲解相机的工作原理、参数配置,并通过实战实现 “多视角切换”“第一人称漫游” 等常见需求,帮助开发者灵活控制场景观察方式。
red润15 天前
three.js
THREE.Ray 和 THREE.Raycaster 用途和功能在 Three.js 中,THREE.Ray 和 THREE.Raycaster 都是与射线(Ray)相关的类,但它们的用途和功能有所不同。
YAY_tyy16 天前
前端·javascript·3d·three.js
Three.js 开发实战教程(五):外部 3D 模型加载与优化实战在前四篇教程中,我们用基础几何体、灯光、相机构建了完整 3D 场景,但实际开发中,复杂模型(如产品、角色、工业设备)需从 Blender、3ds Max 等建模软件导出,再导入 Three.js 使用。本篇将系统讲解外部模型加载的核心知识,通过 “静态模型加载”“动画模型控制” 两大实战案例,结合官方规范与开发经验,补充模型优化技巧和常见问题解决方案,帮大家打通 “模型落地” 最后一公里。
入秋16 天前
前端·前端框架·three.js
Three.js 实战之电子围栏可根据模型自动生成在三维可视化或数字孪生项目中,光墙(Light Wall)是一种常见的视觉效果,常用于强调场景区域、形成边界或增加科技未来感。本文将基于 Three.js,深入解析一个 useLightWall 类的实现,展示如何通过几何体、材质与动画组合实现不同类型的光墙效果。
答案answer17 天前
前端·three.js
three.js着色器(Shader)实现数字孪生项目中常见的特效在Three.js的学习中过程中如果你已经对材质,几何体,灯光,动画,模型,场景,相机,渲染器等内容非常熟悉之后,那么作者非常推荐你去进阶学习一下ShaderMaterial(着色器材质)的使用,因为ShaderMaterial不仅能实现很多炫酷的效果,而且也是很多数字孪生平台项目中必会出现的场景之一。
KallkaGo22 天前
前端·webgl·three.js
threejs复刻原神渲染(三)从上篇博客发出到现在已经过了一年多了,之前挖的坑一直都没有填,做事都要有始有终,所有才有了这一篇博客本文涉及的内容主要有:
刘皇叔code24 天前
webgl·three.js
如何给Three.js中ExtrudeGeometry的不同面设置不同材质Three.js有很多基础的几何体,对于一些简单的图形形状,可以不用每次都劳烦建模的同学去提供一个模型,常常这些基础几何体就可以绘制了。ExtrudeGeometry是在开发中非常常用的一种几何体,它非常灵活,可以先用一系列二维顶点绘制一个二维图形,然后沿着一定的方向将这个二维图形拉成一个三维几何体,这在很多场景下非常有用,比如隧道、建筑大楼,都可以用这种方式生成一个简单的示意性的几何体。 但是,如果需要给这个几何体设置材质时,又会感觉不够灵活了,要么只能全部表面都用一直材质;要么就是两种材质:顶面底面一