尝试创建一个用于克隆实体的组件,整体而言似乎工作得很好。然而,我用" mesh.lookAt(正常)"设置的旋转。没有来到克隆。我认为它与对象层次结构有关,因为控制台中的结果对于原始和克隆是不同的。
// Returns Mesh
console.log(initial.getObject3D('mesh'));
// Returns undefined
console.log(clone.getObject3D('mesh'));
为什么这两条线路会返回不同的东西?
谢谢!
<!DOCTYPE html>
<html>
<head>
<title>Simple Duplicate Test</title>
<script src="https://aframe.io/releases/0.4.0/aframe.min.js"></script>
</head>
<body>
<script>
// Duplicate
AFRAME.registerComponent('duplicate', {
init: function () {
// Geometry
var initial = this.el;
var scene = this.el.sceneEl;
// Click
var duplicate_button = document.getElementById( 'duplicate' );
duplicate_button.addEventListener('click', function() {
var clone = initial.cloneNode(true);
clone.setAttribute('position', {x: -1.5, y: 1.5, z: -2.5});
scene.appendChild(clone);
// Returns Mesh
console.log(initial.getObject3D('mesh'));
// Returns undefined
console.log(clone.getObject3D('mesh'));
});
}
});
</script>
<!-- Button -->
<button type="button" class="button" id="duplicate">DUPLICATE MESH</button>
<!-- A-Frame Scene -->
<a-scene>
<a-assets>
<a-asset-item id="tree-obj" src="geo/tree.obj"></a-asset-item>
</a-assets>
<a-entity>
<a-box id="box" position="1.5 1.5 -2.5"
rotation="0 0 0" duplicate
></a-box>
</a-entity>
<a-sky color="#2c3e50"></a-sky>
</a-scene>
</body>
</html>
答案 0 :(得分:1)
尝试等待克隆附加并初始化:
clone.addEventListener('loaded', function () {
console.log(clone.getObject3D('mesh'));
});