Как просмотреть модель OBJ с текстурой, экспортированной из блендера с помощью react-three-fiber

Это компонент модели, который показывает только модель OBJ, но без текстуры. Вся идея проекта заключается в просмотре 3D-моделей в сети, но текстуры не появляются ни на одном из объектов.

import React, { useState, useMemo } from "react"
import { OBJLoader } from "three/examples/jsm/loaders/OBJLoader"
import { MTLLoader } from "three/examples/jsm/loaders/MTLLoader"

const ObjModel = (props) => {
    const [obj, set] = useState()

    useMemo(() => {
        new MTLLoader().load(props.murl, material => {
            material.preload()
            new OBJLoader().setMaterials(material).load(props.url, set)
        })
    }, [props.url, props.murl])

    return obj ? <primitive position={[0, 0, 0]} object={obj} /> : null
}

export default ObjModel

Вызов компонента модели:

import React from "react"
import { Canvas } from "react-three-fiber"
import Model from "./buildComponents/Model"

import MaskMURL from "../models/Mask.mtl"
import MaskURL from "../models/Mask.obj"
import MaskDesignMURL from "../models/MaskDesign.mtl"
import MaskDesignURL from "../models/MaskDesign.obj"
import { OrbitControls } from "drei"

const MyCanvas = () => {
    return (
        <Canvas style={{ background: "black" }} camera={{ position: [-28, 0, 0] }}>
            <Model url={MaskDesignURL} murl={MaskDesignMURL} />
            <Model url={MaskURL} murl={MaskMURL} />

            <OrbitControls />
            <ambientLight />
            <pointLight position={[-20, -5, 0]} />
        </Canvas >
    )
}

export default MyCanvas

Ссылка на проект Github для полного проекта: https://github.com/A7madSab/Object-Viewer Обратите внимание, что я использовал тот же<ObjModel /> компонент для просмотра.obj из Google Poly API, и он работал, но он не будет работать с моделями, которые я загружаю или создаю сам.

Мне нужно знать, как просмотреть импортированную текстуру или даже как применить текстуру к импортированной модели.

Пожалуйста, помогите, мне это нужно для моего выпускного проекта.

0 ответов

Другие вопросы по тегам