threejs | 行动力是现实的魔法

关于threejs使用raycaster拾取不准确的问题，排除画布大小干扰外，关键得看某参数

2024-04-12 raycaster 拾取不准确 threejs

事情是这样的，我创建了一条线，由数百个点构成。
但是每当进行拾取的时候，还没挨着线条，隔老远就拾取到了。
在网上找相应的案例，看到别人设置了一个raycaster.params.Line.threshold = 0
…

layers.test()底层是怎么判断两个对象的图层相同的？

2024-04-12 底层代码判断图层相同 threejs

	class Layers {
		constructor() {
			this.mask = 1 | 0;

            
              
              ……

threejs拖拽物体的时候与另外物体交叉时产生抖动或瞬移的解决思路

2024-04-12 物体重叠时抖动拖拽 threejs

经过观察，发现使用raycaster这个射线工具来追踪物体时，当拖拽物体时，物体之间产生交叉，而我在pointermove这个事件中又没有经过严格判定（也就是不管是否按下鼠标左键，都同样进行物体切换），这就导致了在拖拽途中，控制器所控制的对象发生了切换。要解决也简单，因为在鼠标事件中有一个叫做pressure的属性，它为0的话表示鼠标按键没有按下。把这个限制条件加上，问题就得到解决了。

const pointerMove=(event)=>{

            
              
              ……

threejs中orbitcontrols中的摄像机对应的属性是Object，控制它旋转的关键在于up属性

2024-04-12 摄像机方向摄像机 threejs

换言之

const controls = new OrbitControls(camera,renderer.domElement);//创建控件对象
controls.object.up=new Vector3(0,1,0);//确认（0,1,0）这个方向为摄像机的正上方。

            
              
              ……

threejs创建GUI参数的时候，明明写了默认值，以及滑块，但不出现滑块

2024-04-12 滑块编译检查弱类型 threejs

    const gui = new GUI();

    let params={

            
              
              ……



         animationloop();

            
              
              ……

关于threejs中设置辉光（也就是bloom）效果后，出现马赛克的问题

2024-04-12 threejs 辉光 bloom 图形渲染

我自己碰到的情况是换了高分辨率屏幕，并且改了示例代码，导致没能匹配高分辨率。

在渲染器附近的代码加上

renderer.setPixelRatio(window.devicePixelRatio);

            
              
              ……

标签: threejs

关于threejs使用raycaster拾取不准确的问题，排除画布大小干扰外，关键得看某参数

layers.test()底层是怎么判断两个对象的图层相同的？

threejs拖拽物体的时候与另外物体交叉时产生抖动或瞬移的解决思路

threejs中orbitcontrols中的摄像机对应的属性是Object，控制它旋转的关键在于up属性

threejs创建GUI参数的时候，明明写了默认值，以及滑块，但不出现滑块

threejs在设置尺寸的时候，如果想要显示多个画面，不要设置为单个画面的尺寸

threejs没法加载声音

我终于明白在threejs中为什么requestAnimationFrame(callback)放在callback中第一行也不会造成死循环的原因了

关于threejs中设置辉光（也就是bloom）效果后，出现马赛克的问题