You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

Babylon JS:如何让子网格跟随父网格位移但不继承缩放?

实现子网格仅跟随父网格位移、不继承缩放的简便方法

嘿,这个需求在Babylon.js里其实有挺省心的实现方式,不用自己从头写复杂逻辑~下面给你两种常用方案,按需选就行:

方案一:用内置的Transform约束(推荐)

Babylon.js自带了TransformNode约束系统,可以精准控制子节点继承父节点的哪些变换属性,完全满足你的需求。

代码示例

// 假设你已经有现成的scene实例
const scene = new BABYLON.Scene(engine);

// 1. 创建父网格
const parentMesh = BABYLON.MeshBuilder.CreateBox("parentBox", {size: 2}, scene);
parentMesh.position.set(0, 0, 0);
// 给父网格加个缩放,方便测试效果
parentMesh.scaling.set(2, 1, 1);

// 2. 创建子网格
const childMesh = BABYLON.MeshBuilder.CreateSphere("childSphere", {diameter: 1}, scene);
// 设置子网格相对于父网格的初始偏移
childMesh.position.set(3, 0, 0);

// 3. 创建并配置约束
const transformConstraint = new BABYLON.TransformNodeConstraints();
transformConstraint.scaleInheritance = BABYLON.TransformNodeConstraints.INHERITANCE_NONE; // 禁止继承缩放
transformConstraint.positionInheritance = BABYLON.TransformNodeConstraints.INHERITANCE_FULL; // 完全继承位移

// 4. 将约束应用到子网格,指定父节点
childMesh.setTransformNodeConstraints(parentMesh, transformConstraint);

这样操作后,父网格移动时子网格会自动跟随,而父网格缩放时子网格的缩放完全不受影响,全程都是引擎内置逻辑,性能也有保障。

方案二:自定义帧更新逻辑(适合复杂场景)

如果需要更灵活的控制(比如加上额外的位置偏移逻辑),可以通过场景的帧更新事件手动同步位置,同时锁定子网格的缩放:

代码示例

// 保存子网格的初始缩放,避免被父网格影响
const childInitialScaling = childMesh.scaling.clone();
// 保存子网格相对于父网格的初始相对位置
const relativeOffset = childMesh.position.subtract(parentMesh.position);

// 每帧更新子网格位置
scene.onBeforeRenderObservable.add(() => {
    // 同步父网格的位置,加上初始相对偏移
    childMesh.position = parentMesh.position.add(relativeOffset);
    // 强制保持子网格的初始缩放
    childMesh.scaling = childInitialScaling;
});

这个方案自由度更高,你可以在帧更新里加任何自定义逻辑,比如根据父网格的其他属性调整子节点位置,但相比内置约束会多一点手动代码。


内容的提问来源于stack exchange,提问作者KingJulian

火山引擎 最新活动