Не отображается 3d модель в Three js, GLTFLoader

Question

сделал простенький код, хочу загрузить 3d model на сайт, но она не отображается или вообще не загружается. Ошибок в консоли нету.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/Css/Style.css">
    <title>Document</title>
    <script type="module" src="/Moduls/three.min.js"></script>
    <script type="module" src="/Moduls/GLTFLoader.js"></script>
    <script type="module" src="/Moduls/three.module.js"></script>
    
    
</head>
<body>
    <style>
        body{
            margin: 0;
        }
    </style>
<script type="module">

        var Scene = new THREE.Scene();
        var Camera = new THREE.PerspectiveCamera(80, window.innerWidth/ window.innerHeight, 0.1, 40000);
        var Renderer = new THREE.WebGLRenderer({alpha: true});
        
        Camera.position.z = 100;
        
        Renderer.setSize( window.innerWidth, window.innerHeight);
        document.body.appendChild(Renderer.domElement);
        
        var Geometry = new THREE.BoxGeometry(10, 10);
        var MaterC = new THREE.MeshBasicMaterial({ color: 0x00FFFF});
        var Circl = new THREE.Mesh (Geometry, MaterC);
        Scene.background = new THREE.Color(0xffffff  );
        
        Scene.add(Circl);
        
        const aLight = new THREE.AmbientLight(0x404040, 1.2);
        const pLight = new THREE.PointLight(0x0FFFFFF, 1.2);
        pLight.position.set(0,-3,7);
        
        Renderer.setSize(window.innerWidth, window.innerHeight);
        
        Scene.add(aLight, pLight);
        
        
        
        import {GLTFLoader} from './Moduls/GLTFLoader.js';
        
        let loader = new GLTFLoader();
        
        loader.load( './Img/Back.gltf', function (gltf) {
            
            let obj = gltf;
            obj.scene.scale.set(10.3, 10.3, 10.3);
            obj.scene.position.z = 12;
            Scene.add(gltf.scene);
            Scene.add(obj.scene);
        
            Renderer.render(Scene, Camera);
        
            const AroHelp = new THREE.SkeletonHelper (Circl);
            Scene.add(AroHelp);
        }, undefined, function ( error ) {
            
            console.error( error );
        
        } );
        


        
        
    </script>
    
    
   
</body>
</html>

БЛОГ НА HUSL

Не отображается 3d модель в Three js, GLTFLoader

Ответы (0 шт):