импорт 3d моделей в вавилон при использовании реакции - PullRequest
0 голосов
/ 30 мая 2020

Я использовал babylon js в среде reactjs, и пока это очень хорошо. Однако у меня возникли проблемы с загрузкой 3D-моделей на холст. Мне удалось загрузить модели в нереагирующую среду, но не в реакционную среду.

Вы можете увидеть простой пример моего текущего кода ниже.

import React from 'react'
import {useEffect, useState, useRef} from 'react'

import path from 'path'

import * as BABYLON from '@babylonjs/core'
import 'babylonjs-loaders'
import SceneComponent from 'babylonjs-hook'; // ^^ point to file we created above or 'babylonjs-hook' NPM.
import SceneComp from '../components/babylonComponent'

const MyPage = () =>{
    var box = undefined
    var page = "landing"

    //this configures the scene
    const onSceneReady = (scene) =>{

        scene.clearColor = BABYLON.Color3.Black()

        //create and position free camera
        var camera = new BABYLON.FreeCamera('camera1', new BABYLON.Vector3(0, 5, -10), scene)

        //this targets the camera to scene of origin
        const canvas = scene.getEngine().getRenderingCanvas()

        //attatch camera to canvas
        camera.attachControl(canvas, true)

        //this creates a light aiming 0,1,0 - to the sky (non - mesh)
        var light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0,1,0), scene)

        //default intensity is 1, let's dim the light a small amount
        light.intensity = 0.7


        var myModel = BABYLON.SceneLoader.Append("./3dAssetts/untitled-scene-babylon/", "untitled-scene.babylon", scene, function(meshes){

        })
        return scene
    }


    //this funciton will run on every frame render
    const onRender = (scene) =>{

    }

    return(
        <div>
            <div style={canvasStyler}>
                <SceneComp antialias onSceneReady={onSceneReady} onRender={onRender} id='my-canvas' />
            </div>
        </div>
    )
}
const menuButton= {
    color:'black',
    textDecoration:'none',
  }

const canvasStyler ={
    position:'absolute',
    width:'100%',
    top:'0px',
    zIndex:'-1'
}

export default MyPage

Холст и страница загружается нормально, но 3D-модель не загружается, и я получаю следующую ошибку.

Невозможно загрузить из ./3dAssetts/untitled-scene-babylon/untitled-scene.babylon: importScene of undefined из неопределенной версии: undefined, версия экспортера: undefinedimportScene не удалось JSON parse

Невозможно понять, что я делаю неправильно, у кого-нибудь есть идеи?

Ответы [ 2 ]

0 голосов
/ 10 августа 2020

Если вы используете версию 4, попробуйте заменить

import 'babylonjs-loaders'

на

import '@babylonjs/loaders'
0 голосов
/ 30 мая 2020

Мне удалось получить файлы 3D-модели .babylon, импортированные с помощью следующего:

Я создал папку с ресурсами в папке create-response-app / publi c.

Затем я поместил мой файл .babylon в эту папку и вызвал его в коде import me sh, используя следующий:

var car = BABYLON.SceneLoader.Append("./assets/", "carModel.babylon", scene, function(meshes){
        })

Однако у меня все еще возникают проблемы с загрузкой других типов объектных файлов, таких как .gltf и. OBJ

для получения дополнительной информации см. Следующую полезную ссылку

https://www.html5gamedevs.com/topic/40304-trouble-loading-assets-in-react/

...