(New on Threejs User)
For Example
If there is watch then Hands of the watch differently and it’s band differently?
If yes then How?
What do you mean by “to target” ? Retrieve them in the code? Or let the user interact with them separately?
(In either case - you’ll need to make sure they are also separated in the model itself, they shouldn’t be a single geometry, that’d make things quite very complicated.)
in the gltf i have an array in which I have different pieces of the keyboard
So I want to target the one back of the buttons only
i am doing this but this does not specifically showing what I want
import { useRef, useState } from “react”;
import { useGLTF, PresentationControls, Environment, ContactShadows, Html, OrbitControls } from “@react-three/drei”;
import { useLoader, useFrame } from “@react-three/fiber”;
import { GLTFLoader } from “three/examples/jsm/loaders/GLTFLoader.js”;
import { useSpring, animated, config } from “@react-spring/three”;
function Keyboard3d(props) {
const gltf = useLoader(GLTFLoader, “/cpkeyboard.glb”);
console.log(“THIS”, gltf.scene.children[169]);
return (
<group {…props} dispose={null}>
<Html scale={0.01} rotation={[-1.5, 0, 0]} position={[0, 0.14, 0]} transform occlude>
<primitive object={gltf.scene.children[169]} scale={0.1} position={[0, 0, 0]} />
{/* <primitive object={} scale={0.1} position={[0, 0, 0]} /> */}
);
}
export default Keyboard3d;
