three.js 杂记

欧拉角旋转变换 x,y,z 弧度单位 THREE.MathUtils.DEG2RAD 度数转弧度

new THREE.Euler( - 90 * THREE.MathUtils.DEG2RAD, 0, 0 )

radius:半径

setFromSphericalCoords ( radius : Float, phi : Float, theta : Float ) : this

从球坐标中的radiusphitheta设置该向量。

material.map.anisotropy

anisotropy 沿着轴,通过具有最高纹素密度的像素的样本数。 默认情况下,这个值为1。设置一个较高的值将会产生比基本的mipmap更清晰的效果,代价是需要使用更多纹理样本。 使用renderer.capabilities.getMaxAnisotropy() 来查询GPU中各向异性的最大有效值;这个值通常是2的幂。

八叉树辅助

import { OctreeHelper } from 'three/addons/helpers/OctreeHelper.js';

const helper = new OctreeHelper( worldOctree );

scene.add( helper ); 模型结构辅助

//相机世界方向

camera.getWorldDirection( playerDirection );

物体选择器

import { SelectionBox } from 'three/addons/interactive/SelectionBox.js';

// mirror sphere cube-camera 创建一个具有镜面反射效果的球体的

const cubeRenderTarget = new THREE.WebGLCubeRenderTarget( 1024 );

mirrorSphereCamera = new THREE.CubeCamera( 0.05, 50, cubeRenderTarget );

scene.add( mirrorSphereCamera );

const mirrorSphereMaterial = new THREE.MeshBasicMaterial( { envMap: cubeRenderTarget.texture } );

OOI.sphere.material = mirrorSphereMaterial;

//网格几何体(黄色框框)

const geometry = new THREE.SphereGeometry( 100, 100, 100 );

const wireframe = new THREE.WireframeGeometry( geometry );

const line = new THREE.LineSegments( wireframe );

line.material.depthTest = false;

line.material.opacity = 0.25;

line.material.transparent = true; scene.add( line );

THREE.LineBasicMaterial是Three.js中的一个材质类,用于定义线条渲染的外观。在这个例子中,材质的配置对象包含一个属性vertexColors,它被设置为true。这意味着线条上的每个顶点都可以有自己的颜色,而不是整个线条使用单一颜色。这允许创建更加丰富和多彩的3D线条效果。

//释放内存优化

function disposeArray() {

this.array = null;

}

geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( positions, 3 ).onUpload( disposeArray ) );

//两个视图

renderer.setScissorTest( true );

renderer.setClearColor( 0x000000, 1 );

renderer.setScissor( 0, 0, SCREEN_WIDTH / 2, SCREEN_HEIGHT );

renderer.setViewport( 0, 0, SCREEN_WIDTH / 2, SCREEN_HEIGHT );

renderer.render( scene, activeCamera );

renderer.setClearColor( 0x111111, 1 );

renderer.setScissor( SCREEN_WIDTH / 2, 0, SCREEN_WIDTH / 2, SCREEN_HEIGHT );

renderer.setViewport( SCREEN_WIDTH / 2, 0, SCREEN_WIDTH / 2, SCREEN_HEIGHT );

renderer.render( scene, camera );

//arrayC~集中管理多个相机

camera = new THREE.ArrayCamera( cameras );

render:

logarithmicDepthBuffer: logDepthBuf:这个属性用于启用对数深度缓冲。对数深度缓冲是一种技术,它可以改善远距离物体的渲染效果,特别是在透视投影中。当物体非常远时,它们的深度值会变得非常小,这可能导致渲染错误或Z-fighting(两个平面在视图中相互竞争,导致闪烁或不正确的渲染)

{ antialias: true, logarithmicDepthBuffer: logDepthBuf }

相关推荐
CodeCraft Studio6 分钟前
PDF处理控件Aspose.PDF教程:使用 Python 将 PDF 转换为 Base64
开发语言·python·pdf·base64·aspose·aspose.pdf
零点零一8 分钟前
VS+QT的编程开发工作:关于QT VS tools的使用 qt的官方帮助
开发语言·qt
2501_915918411 小时前
Web 前端可视化开发工具对比 低代码平台、可视化搭建工具、前端可视化编辑器与在线可视化开发环境的实战分析
前端·低代码·ios·小程序·uni-app·编辑器·iphone
程序员的世界你不懂2 小时前
【Flask】测试平台开发,新增说明书编写和展示功能 第二十三篇
java·前端·数据库
索迪迈科技2 小时前
网络请求库——Axios库深度解析
前端·网络·vue.js·北京百思可瑞教育·百思可瑞教育
gnip2 小时前
JavaScript二叉树相关概念
前端
lingchen19062 小时前
MATLAB的数值计算(三)曲线拟合与插值
开发语言·matlab
gb42152873 小时前
java中将租户ID包装为JSQLParser的StringValue表达式对象,JSQLParser指的是?
java·开发语言·python
一朵梨花压海棠go3 小时前
html+js实现表格本地筛选
开发语言·javascript·html·ecmascript
蒋星熠3 小时前
Flutter跨平台工程实践与原理透视:从渲染引擎到高质产物
开发语言·python·算法·flutter·设计模式·性能优化·硬件工程