Issue 1:
Description of the problem

Three.js version

Dev

r95

...

Browser

All of them

Chrome

Firefox

Internet Explorer

OS

All of them

Windows

macOS

Linux

Android

iOS

I previously posted this problem on Stackoverflow but got no responses. However I decided to post it here as well as it's only a problem with FBX models and not OBJ models, which makes it look like some kind of bug.

I am loading FBX models for my project. I Want to create multiple objects of the same FBX model but loading each separately is very inefficient so I would like to save one loaded model and clone it. This concept is working with the .OBJ format.

Everything works as expected but then I use "model.clone();" nothing really happens.

The model is no longer visible but I get no errors. If you compare the cloned model with the original they look exactly the same so I don't know why it's not showing up.

The part of the code where you can compare the two is:

"var sendModel = model;//Works

//var sendModel = model.clone();//Doesn't works"

Starting at line 30.

Here is some simplified working source code:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script src="https://vitalkia.com/jsLibraries/zlib.min.js"></script>
<script src="https://threejs.org/build/three.js"></script>
<script src="https://threejs.org/examples/js/loaders/FBXLoader.js">
</script>
<script>
var aspectRatio = 240 / 135;
var scene;
var renderer;
var loaderFBX;
var camera = new THREE.PerspectiveCamera(45, aspectRatio, 1, 10000);

//Actual code
//Setus up scene and renderer
sceneSetup();

//Load fbx and render
//IGNORE ERROR ABOUT NOT FINDING THE RIGHT TEXTURE. It still works
loaderFBX.load("https://threejs.org/examples/models/fbx/Samba Dancing.fbx", function(model){
//Sending the object "model" works
//But using model.clone() does not. It doesn't give any errors or anything, it's just not visible
//If you compare the cloned model with the original they look exactly the same.

var sendModel = model;//Works
//var sendModel = model.clone();//Doesn't works
console.log("Original: ");
console.log(model);
console.log("Cloned: ");
console.log(model.clone());

calcDistance(sendModel);

scene.add(sendModel);
renderer.render(scene, camera);
});

function calcDistance(model){
var bbox = new THREE.Box3().setFromObject(model);

var camDistance = bbox.max.z;
if(bbox.max.x > camDistance){
camDistance = bbox.max.x;
}
if(bbox.max.y*aspectRatio > camDistance){
camDistance = bbox.max.y*aspectRatio;
}

camera.position.z = camDistance;
model.position.x -= bbox.getCenter().x;
model.position.y -= bbox.getCenter().y;
}

function sceneSetup(){
loaderFBX = new THREE.FBXLoader();
scene = new THREE.Scene();
renderer = new THREE.WebGLRenderer({antialias: true, alpha: true});
renderer.setSize(240, 135);
document.body.appendChild(renderer.domElement);
var light1 = new THREE.PointLight(0xffffff, 1, 100000000);
light1.position.set(0, 0, 15);
scene.add(light1);
var newLightPoint = new THREE.HemisphereLight(0x8be2ff, 0xfff9cf, 0.55);
scene.add(newLightPoint);
camera.position.set(0, 0, 100);
scene.add(camera);
}
</script>
</body>
</html>

Issue 2:
There are a few things which geometry.clone() doesn't copy a reference to, which it should.

.bones

.skinWeights

.skinIndices

.animations

.animation

are all left without references to the original, which leads to skinning being broken unless the references to those are manually copied. I think references should be passed as it's less confusing, but I don't think they should be deep copies, or this would lead to mostly wasted memory.