# How to show dynamic position of instance with react + cannon?

**URL:** <https://discourse.threejs.org/t/how-to-show-dynamic-position-of-instance-with-react-cannon/58712>\
**Category:** Questions\
**Tags:** react-threedrei, cannonjs, react-three-fiber\
**Created:** [November 29, 2023, 6:53pm UTC](https://discourse.threejs.org/t/how-to-show-dynamic-position-of-instance-with-react-cannon/58712 "2023-11-29T18:53:34Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![espace3d](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/espace3d/32/26134_2.png) [@espace3d](https://discourse.threejs.org/u/espace3d)\
**Post date:** [November 29, 2023, 6:53pm UTC](https://discourse.threejs.org/t/how-to-show-dynamic-position-of-instance-with-react-cannon/58712/1 "2023-11-29T18:53:34Z")

</div>

Hi,

I’d really like to be able to use react for its conciseness, but I’m starting to get fed up with its complexity with cannon.js ☹

How can I display via Useframe the dynamic position of instances that are moved via other support instances? I’m lost since 3 days.

This concerns lines 99 to 105 of the codesandbox.

[https://codesandbox.io/p/sandbox/2023-v14-minimal-test-instance-physics-x56wt7?file=%2Fsrc%2FApp.js%3A107%2C11](https://codesandbox.io/p/sandbox/2023-v14-minimal-test-instance-physics-x56wt7?file=%2Fsrc%2FApp.js%3A107%2C11)

Thanks for your help.

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [November 30, 2023, 8:19am UTC](https://discourse.threejs.org/t/how-to-show-dynamic-position-of-instance-with-react-cannon/58712/2 "2023-11-30T08:19:37Z")

</div>

1. To use instances, you need to update [instanceMatrix](https://threejs.org/docs/index.html?q=instance#api/en/objects/InstancedMesh.instanceMatrix). For what I see in r3f repo - [you have to do it manually via vanilla Three.js API](https://github.com/pmndrs/react-three-fiber/discussions/761#discussioncomment-108299). `InstancedMesh.position` will not return you anything meaningful, since all per-instance transformations are done within `instanceMatrix`. You can retrieve transformation matrix for a specific instance by using [InstancedMesh.getMatrixAt](https://threejs.org/docs/index.html?q=instance#api/en/objects/InstancedMesh.getMatrixAt) - from that you can [decompose the position / rotation / scale](https://threejs.org/docs/index.html?q=instance#api/en/math/Matrix4.decompose).
2. All things mentioned in point (1) are vanilla three.js API - so no reason to be angy at r3f.
3. There’s really no reason to use instancing in your case btw. If it blocks you for 3 days - just skip it until you render enough draw calls to see the FPS drop 😊 Using instancing is not super trivial on it’s own, using instancing with physics will be even more annoying and blocking unless you’re already familiar with using instancing without physics.