javascript - 在 three.js 中加载的对象 - 位置错误

Question

我正在制作一个虚拟旅游编辑器，我需要在某些坐标上放置一些地图图钉。在开发后端逻辑时，我只使用球体作为“占位符”。现在，当一切正常时，我想用实际的 pin 对象替换球体。问题是，当我加载 pin 对象并为这些球体设置相同的坐标时，pin 位于不同的位置。

我试图将这些坐标放在根对象、网格对象上，结果总是相同的。还尝试将坐标记录到控制台中，这是正确的。

     ADD_HOTSPOT_TO_SCENE: function(context, hotspot) {

        // SPHERE CODE
        let geometry = new THREE.SphereBufferGeometry( 1, 60, 40 );
        let mat = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
        let cube = new THREE.Mesh( geometry, mat );

        // set position of hotspot
        cube.position.set(hotspot.x, hotspot.y, hotspot.z);

        // set unique object name to pair with hotspot object
        cube.name = hotspot.getUniqueID();

        cube.scale.x = hotspot.scale / 10;
        cube.scale.y = hotspot.scale / 10;
        cube.scale.z = hotspot.scale / 10;

        // add object to scene as draggable object
        context.commit('ADD_DRAGGABLE_OBJECT_TO_SCENE', cube);

        // OBJECT CODE
        let material = new THREE.MeshBasicMaterial({
            map: new THREE.TextureLoader().load(Tour.mapPinTexture)
        });

        context.state.loader.load(Tour.mapPinObj, function(object){
            object.position.set(hotspot.x, hotspot.y, hotspot.z);
            object.name = hotspot.getUniqueID();
            object.traverse( function ( node ) {
                if ( node.isMesh ) {
                    node.material = material;
                }

            } );
            var box = new THREE.BoxHelper( object, 0xffff00 );
            context.commit('ADD_DRAGGABLE_OBJECT_TO_SCENE', object);
            context.commit('ADD_TO_SCENE', box);
        });
    }

我需要将对象放在与球体相同的位置。当前输出如下所示：https ://i.imgur.com/H0tfNIx.jpg ..我错过了什么吗？

标签： javascriptthree.jsvirtual-reality