#yyds干货盘点#THREE.BoxHelper的使用注意

【#yyds干货盘点#THREE.BoxHelper的使用注意】愿君学长松,慎勿作桃李。这篇文章主要讲述#yyds干货盘点#THREE.BoxHelper的使用注意相关的知识,希望能为你提供帮助。
在使用THREE.BoxHelper的时候,有时经常发现BoxHelper并没有包围住盒子,是什么原因了?
1.测试代码

const group = new THREE.Group() const cube = addCube() const cube2 = addCube( color: #bb3 ) cube2.position.set(20, 0, 0) group.add(cube, cube2) const boxHelper = new THREE.BoxHelper(group, red) scene.add(boxHelper) scene.add(group)

2.此时的效果如下:
#yyds干货盘点#THREE.BoxHelper的使用注意

文章图片

  • 发现是吻合的,没有问题
3.测试代码const group = new THREE.Group()
const cube = addCube()
const cube2 = addCube(
color: #bb3
)
cube2.position.set(20, 0, 0)
group.add(cube, cube2)
const boxHelper = new THREE.BoxHelper(group, red)
group.scale.set(0.5, 0.5, 0.5)
scene.add(boxHelper)
scene.add(group)
4.此时的效果如下:
#yyds干货盘点#THREE.BoxHelper的使用注意

文章图片

5.核心代码说明
#yyds干货盘点#THREE.BoxHelper的使用注意

文章图片

  • 出现这个的原因应该是: 在BoxHelper的后面对group进行了缩放操作
    同理,改变位置,也会有相同的问题
    #yyds干货盘点#THREE.BoxHelper的使用注意

    文章图片

    此时的效果如下:
    #yyds干货盘点#THREE.BoxHelper的使用注意

    文章图片

    同理,旋转角度,也会有相同的问题
    #yyds干货盘点#THREE.BoxHelper的使用注意

    文章图片

    此时的效果如下:
    #yyds干货盘点#THREE.BoxHelper的使用注意

    文章图片
    6.总结
  • 在使用了BoxHelper以后,再对group进行位置大小角度操作的话,就会出现不吻合的现象

    推荐阅读