# I want my model to rotate back to it's original position not reset

**URL:** <https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438>\
**Category:** Discussion\
**Tags:** materials, animation, geometry\
**Created:** [October 26, 2023, 10:47am UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438 "2023-10-26T10:47:49Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Hamzah](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/hamzah/32/41286_2.png) [@Hamzah](https://discourse.threejs.org/u/Hamzah)\
**Post date:** [October 26, 2023, 10:47am UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438/1 "2023-10-26T10:47:49Z")

</div>

I want my model to ratate back to it’s original position not reset just.  
import { useRef, useState } from “react”;  
import { useLoader } from “@react-three/fiber”;  
import { GLTFLoader } from “three/examples/jsm/loaders/GLTFLoader.js”;  
function Keyboard3d(props) {  
const gltf = useLoader(GLTFLoader, “/cpkeyboard.glb”);  
const meshRef = useRef();  
const [hovered, hover] = useState(false);  
const [clicked, click] = useState(false);  
return (  
\<\>  
\<mesh  
{…props}  
ref={meshRef}  
scale={[1.3, 1.1, 1]} // Adjust the scale to increase the size of the model  
position={[0.03, 0, 0]}  
rotation={[Math.PI / 2.7, 0, 0]}  
onPointerOver={(event) =\> (event.stopPropagation(), hover(true))}  
onPointerOut={(event) =\> hover(false)}  
\>  
\<primitive object={gltf.scene} scale={0.1} position={[0, 0, 0]} /\>  
  
\</\>  
);  
}  
export default Keyboard3d;  
and  
\<Canvas camera={{ position: [0, 0, 1.65], fov: 14.5 }}\>  
  
\<pointLight position={[1, 1, 1]} /\>  
\<OrbitControls enableZoom={false} maxPolarAngle={Math.PI / 2} minPolarAngle={Math.PI / 2} ref={controlsRef} /\>

---

<div class="post-metadata">

**Author:** ![Akroob](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/akroob/32/41267_2.png) [@Akroob](https://discourse.threejs.org/u/Akroob)\
**Post date:** [October 26, 2023, 11:04am UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438/2 "2023-10-26T11:04:28Z")

</div>

Not a 100% sure what you are saying. But if you mean you want it to continuously rotate. Then you need to continuously call your rotation + add some in an axis.  
In javascript:

```javascript
function animate() {
 // Add rotation to your model, something like yourmodel.rotation.x += 0.1
  requestAnimationFrame(animate);
}
animate();

```

I think react uses useFrame() ?

---

<div class="post-metadata">

**Author:** ![Hamzah](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/hamzah/32/41286_2.png) [@Hamzah](https://discourse.threejs.org/u/Hamzah)\
**Post date:** [October 26, 2023, 11:10am UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438/3 "2023-10-26T11:10:40Z")

</div>

No I dont want to continiously rotate  
I want to rotate it but when i release the mouse my model must ROTATES back to its orignals

---

<div class="post-metadata">

**Author:** ![Lawrence3DPK](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lawrence3dpk/32/29184_2.png) [@Lawrence3DPK](https://discourse.threejs.org/u/Lawrence3DPK)\
**Post date:** [October 26, 2023, 12:40pm UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438/5 "2023-10-26T12:40:16Z")

</div>

You can use `<PresentationControls>` for this which I’m sure uses react spring under the hood, see this example…

> **[Bouncy watch - CodeSandbox](https://codesandbox.io/embed/qyz5r?codemirror=1)**
>
> Custom springy controls using use-gesture and react-spring.

---

<div class="post-metadata">

**Author:** ![Hamzah](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/hamzah/32/41286_2.png) [@Hamzah](https://discourse.threejs.org/u/Hamzah)\
**Post date:** [October 26, 2023, 3:16pm UTC](https://discourse.threejs.org/t/i-want-my-model-to-rotate-back-to-its-original-position-not-reset/57438/6 "2023-10-26T15:16:09Z")

</div>

It worked Thank You So Much