You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
56 lines
1.3 KiB
56 lines
1.3 KiB
/*
|
|
auto-generated by: https://github.com/pmndrs/gltfjsx
|
|
*/
|
|
import React, { useRef } from 'react'
|
|
import { useGLTF } from '@react-three/drei/useGLTF'
|
|
import * as THREE from 'three'
|
|
import { useTrimesh } from '@react-three/cannon'
|
|
|
|
import { GLTF } from 'three/examples/jsm/loaders/GLTFLoader'
|
|
|
|
type GLTFResult = GLTF & {
|
|
nodes: {
|
|
collisions: THREE.Mesh
|
|
}
|
|
materials: {
|
|
collision: THREE.MeshStandardMaterial
|
|
}
|
|
}
|
|
|
|
export default function Model(props: JSX.IntrinsicElements['group']) {
|
|
const group = useRef<THREE.Group>()
|
|
const { nodes } = useGLTF('/model/plaza_collision.glb') as GLTFResult
|
|
|
|
const material = new THREE.MeshBasicMaterial({
|
|
wireframe: true,
|
|
color: 0xffff00,
|
|
})
|
|
|
|
const geometry = nodes.collisions.geometry as THREE.BufferGeometry
|
|
|
|
if (geometry.index === null) return null
|
|
|
|
const vertices = geometry.attributes.position.array
|
|
const indices = geometry.index.array
|
|
|
|
// @ts-ignore
|
|
const [ref] = useTrimesh(() => ({
|
|
type: 'Static',
|
|
position: [1.73, 1.23, 8.19],
|
|
args: [vertices, indices],
|
|
}))
|
|
|
|
return (
|
|
<group ref={group} {...props} dispose={null}>
|
|
<mesh
|
|
ref={ref}
|
|
material={material}
|
|
geometry={nodes.collisions.geometry}
|
|
visible={false}
|
|
/>
|
|
</group>
|
|
)
|
|
}
|
|
|
|
useGLTF.preload('/model/collision_mesh.glb')
|