NickITDir
@NickITDir
Начинающий разработчик

Почему не отображается 3D модель?

Добрый день!

Не могу подключить модуль Three.js подскажите в чем проблема.

Файлы Three.js находятся в папке static
но модель не загружается в консоли браузера ошибка
Скрипт для отображения модели
<script type="module">
  import * as THREE from "{% static '/main/js/three.module.js' %}";
  import { GLTFLoader } from "{% static '/main/bibleotec/GLTFLoader.js' %}";
  import { OrbitControls } from "{% static 'main/jsm/controls/OrbitControls.js' %}";

  function loadModel(modelId) {
    var modelPath;
    // Определение пути к модели на основе переданного идентификатора
    if (modelId === "model1") {
      modelPath = "{{ STATIC_URL }}/models/GLTF/33_1/1.1/scene.gltf";
    } else if (modelId === "model2") {
      modelPath = "{{ STATIC_URL }}models/other_model.gltf";
    }
    console.log("Model Path:", modelPath);

    const canvas = document.getElementById("model-canvas");
    const renderer = new THREE.WebGLRenderer({ canvas });

    const scene = new THREE.Scene();
    const camera = new THREE.PerspectiveCamera(
      75,
      canvas.width / canvas.height,
      0.1,
      1000
    );
    camera.position.z = 5;

    const loader = new GLTFLoader();
    loader.load(modelPath, function (gltf) {
      scene.add(gltf.scene);
    });

    const ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
    scene.add(ambientLight);

    const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
    directionalLight.position.set(10, 10, 10);
    scene.add(directionalLight);

    const controls = new OrbitControls(camera, renderer.domElement);

    function animate() {
      requestAnimationFrame(animate);
      renderer.render(scene, camera);
    }

    animate();
  }

  // Загрузка модели при загрузке страницы
  window.onload = function () {
    const urlParams = new URLSearchParams(window.location.search);
    const modelId = urlParams.get("model");
    if (modelId) {
      loadModel(modelId);
    }
  };
</script>


и сама ошибка в консоли браузера...
model_viewer/:1 Uncaught TypeError: Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".
  • Вопрос задан
  • 39 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы