https://github.com/evanbacon/expo-three-orbit-controls

🎥 Three.js Orbit Controls (Camera) bridged into React Native
https://github.com/evanbacon/expo-three-orbit-controls

3d ar expo gaming javascript npm react reactnative threejs yarn

Last synced: 3 months ago
JSON representation

🎥 Three.js Orbit Controls (Camera) bridged into React Native

• Host: GitHub
• URL: https://github.com/evanbacon/expo-three-orbit-controls
• Owner: EvanBacon
• License: mit
• Created: 2017-06-06T20:51:17.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2024-03-18T23:04:51.000Z (over 1 year ago)
• Last Synced: 2025-04-13T05:13:18.169Z (3 months ago)
• Topics: 3d, ar, expo, gaming, javascript, npm, react, reactnative, threejs, yarn
• Language: TypeScript
• Homepage:
• Size: 421 KB
• Stars: 79
• Watchers: 3
• Forks: 36
• Open Issues: 12
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# expo-three-orbit-controls

[![supports iOS](https://img.shields.io/badge/iOS-4630EB.svg?style=flat-square&logo=APPLE&labelColor=999999&logoColor=fff)](https://itunes.apple.com/app/apple-store/id982107779)

[![supports Android](https://img.shields.io/badge/Android-4630EB.svg?style=flat-square&logo=ANDROID&labelColor=A4C639&logoColor=fff)](https://play.google.com/store/apps/details?id=host.exp.exponent&referrer=expo-three-orbit-controls)

[![supports web](https://img.shields.io/badge/web-4630EB.svg?style=flat-square&logo=GOOGLE-CHROME&labelColor=4285F4&logoColor=fff)](https://docs.expo.io/workflow/web/)

This is a very rough port of [Three.js `OrbitControls`](https://threejs.org/docs/#examples/en/controls/OrbitControls) for universal React apps with Expo.

- Fully written in TypeScript because it's the best! 🌟

- Internally this uses a basic PanResponder for gestures. PRs to migrate PanResponder to React Native Gesture Handler are very welcome.

- On web, two finger gestures aren't currently implemented.

- On native, the camera may jump when panning + zooming ends due to issues with React Native `PanResponder`.

## ☁️ Installation

```sh

yarn add expo-three-orbit-controls

```

## 🚀 Usage

Import into your project:

```tsx

import OrbitControlsView from 'expo-three-orbit-controls';

```

Check out the [example](./example/App.tsx) for more info.