6.4.3 â€ĸ Published 8 months ago

@react-three/xr v6.4.3

Weekly downloads
169
License
SEE LICENSE IN LI...
Repository
github
Last release
8 months ago
npm install three @react-three/fiber @react-three/xr@latest

What does it look like?

A simple scene with a mesh that toggles its material color between "red" and "blue" when clicked through touching or pointing.recording of interacting with the code below
import { Canvas } from '@react-three/fiber'
import { XR, createXRStore } from '@react-three/xr'
import { useState } from 'react'

const store = createXRStore()

export function App() {
  const [red, setRed] = useState(false)
  return (
    <>
      <button onClick={() => store.enterAR()}>Enter AR</button>
      <Canvas>
        <XR store={store}>
          <mesh pointerEventsType={{ deny: 'grab' }} onClick={() => setRed(!red)} position={[0, 1, -1]}>
            <boxGeometry />
            <meshBasicMaterial color={red ? 'red' : 'blue'} />
          </mesh>
        </XR>
      </Canvas>
    </>
  )
}

How to enable XR for your @react-three/fiber app?

  1. const store = createXRStore() create a xr store
  2. store.enterAR() call enter AR when clicking on a button
  3. <XR>...</XR> wrap your content with the XR component

... or read this guide for converting a react-three/fiber app to XR.

Tutorials

Roadmap

  • đŸ¤ŗ XR Gestures
  • đŸ•ē Tracked Body
  • ↕ react-three/controls

Migration guides

Sponsors

This project is supported by a few companies and individuals building cutting-edge 3D Web & XR experiences. Check them out!

Sponsors Overview

6.4.3

8 months ago

6.4.2

8 months ago

6.3.0

8 months ago

6.4.1

8 months ago

6.4.0

8 months ago

6.2.17

8 months ago

6.2.18

8 months ago

6.2.16

8 months ago

6.2.19

8 months ago

6.2.15

9 months ago

6.2.14

9 months ago

6.2.13

9 months ago

6.2.11

9 months ago

6.2.12

9 months ago

6.2.10

9 months ago

6.2.9

9 months ago

6.2.8

10 months ago

6.2.7

10 months ago

6.2.5

10 months ago

6.2.4

10 months ago

6.2.6

10 months ago

6.2.3

10 months ago

6.2.2

10 months ago

6.1.0

11 months ago

6.1.1

11 months ago

6.0.0

12 months ago

6.2.1

11 months ago

6.2.0

11 months ago

5.6.2

2 years ago

5.6.1

2 years ago

5.6.0

2 years ago

5.7.1

2 years ago

5.7.0

2 years ago

5.5.0

2 years ago

5.3.0

2 years ago

5.4.1

2 years ago

5.4.0

2 years ago

5.1.4

2 years ago

5.2.0

2 years ago

5.0.5

3 years ago

5.1.3

2 years ago

5.0.4

3 years ago

5.1.2

3 years ago

5.0.3

3 years ago

5.1.1

3 years ago

5.1.0

3 years ago

4.1.8

3 years ago

3.6.7

3 years ago

5.0.2

3 years ago

5.0.1

3 years ago

5.0.0

3 years ago

4.1.7

3 years ago

4.1.6

3 years ago

3.6.6

3 years ago

3.6.4

3 years ago

3.6.3

3 years ago

3.6.2

3 years ago

3.6.1

3 years ago

3.6.0

3 years ago

4.1.4

3 years ago

4.1.3

3 years ago

4.1.5

3 years ago

4.1.0

3 years ago

4.0.1

3 years ago

4.0.0

3 years ago

4.1.2

3 years ago

4.1.1

3 years ago

3.5.0

3 years ago

3.4.0

3 years ago

3.3.0

3 years ago

3.2.0

4 years ago

3.1.2

4 years ago

3.1.1

4 years ago

3.0.2

4 years ago

3.1.0

4 years ago

3.0.1

4 years ago

3.0.0

4 years ago

2.1.0

4 years ago

2.0.2

4 years ago

2.0.1

4 years ago

2.0.0-alpha.0

4 years ago

2.0.0-alpha.1

4 years ago

2.0.0

4 years ago

1.1.1

5 years ago

1.1.0

5 years ago