<h5 dir="auto">Description of the problem</h5>
<p dir="auto">Not sure if this is the same bug or two different.</p>
<ol dir="auto">
<li>
<p dir="auto">Whenever SkinnedMesh origin is out of camera frustum, the mesh gets culled even if its actual transformed geometry must be visible on the screen.<br>
Seems like the bounding box used for clipping is not updated with animation.</p>
</li>
<li>
<p dir="auto">Same happens for shadows.<br>
When the SkinnedMesh moves away from its origin in light space, its shadow gets clipped/partially clipped by pointlight's perspectivecamera (I guess).</p>
</li>
</ol>
<p dir="auto">Here's an example in jsfiddle:<br>
<a href="https://jsfiddle.net/vtb6z50j/" rel="nofollow">https://jsfiddle.net/vtb6z50j/</a><br>
Sorry for inline json. The example was dependent of viewport dimensions. Fixed.</p>
<p dir="auto">And its not light.shadow.camera.far, light.shadow.radius bug.<br>
Actually the use case for this was to make a complete animation in any 3d editor (blender in my case) just to play it as is in three.js. So the character isn't moved by mesh.position, there is no need to sync movement/animation and hardcode movement positions.<br>
It just plays baked animation!</p>
<p dir="auto">Update: yes, making frustumCulled = false does fix both problems (which is enough for me to continue),<br>
but most engines update object bbox with root motion/transforms.<br>
Update2: actual temporary fix <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="251487574" data-permission-text="Title is private" data-url="https://github.com/mrdoob/three.js/issues/11991" data-hovercard-type="issue" data-hovercard-url="/mrdoob/three.js/issues/11991/hovercard?comment_id=323610001&amp;comment_type=issue_comment" href="https://github.com/mrdoob/three.js/issues/11991#issuecomment-323610001">#11991 (comment)</a></p>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r87</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r85</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Firefox</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Windows</li>
</ul>
<h5 dir="auto">Hardware Requirements (graphics card, VR Device, ...)</h5>
<h5 dir="auto">Description of the problem</h5>
<p dir="auto">Hi,</p>
<p dir="auto">I've been playing around with a model for a while, and noticed that if I load it in three.js and zoom closely to the head, it disappears, along with the helmet.</p>
<p dir="auto">I'm sure it's not the clipping field, because they disappear suddenly, from one frame to another.</p>
<p dir="auto">I'm also sure this bug is not limited to <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/donmccurdy/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/donmccurdy">@donmccurdy</a> 's gltf viewer ( <a href="https://gltf-viewer.donmccurdy.com/" rel="nofollow">https://gltf-viewer.donmccurdy.com/</a> ), as I tested it in a project made from scratch recently, and the bug appears there, too.</p>
<p dir="auto">It works flawlessly in the babylon sandbox: <a href="http://sandbox.babylonjs.com/" rel="nofollow">http://sandbox.babylonjs.com/</a>, so I believe this has something to do with three.js.</p>
<p dir="auto">Also, I think it has something to do with the fact that the mesh is skinned. If I apply the armature pose in blender before exporting, then the model appears correctly in three.js as well.</p>
<p dir="auto">I attach a zip with 2 model files, one with skin, the other one with the applied pose:<br>
<a href="https://github.com/mrdoob/three.js/files/2205971/player.zip">player.zip</a></p>
<p dir="auto">Three.js:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/10392261/42885336-02355ef4-8aa1-11e8-897b-531b6a133272.PNG"><img src="https://user-images.githubusercontent.com/10392261/42885336-02355ef4-8aa1-11e8-897b-531b6a133272.PNG" alt="capture2" style="max-width: 100%;"></a></p>
<p dir="auto">Babylon.js:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/10392261/42885318-f717b404-8aa0-11e8-8611-1cd9f75d7a1c.PNG"><img src="https://user-images.githubusercontent.com/10392261/42885318-f717b404-8aa0-11e8-8611-1cd9f75d7a1c.PNG" alt="capture" style="max-width: 100%;"></a></p>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Dev</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r94</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> ...</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Chrome</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Firefox</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Internet Explorer</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Windows</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> macOS</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Linux</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Android</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> iOS</li>
</ul>