Three Viewport Gizmo

Three Viewport Gizmo is a highly customizable standalone interactive version of the official three.js viewport helper, it can be used alone or in conjuncture with OrbitControls or custom camera controllers like @yomotsu/camera-controls.

📚 Documentation -
🚀 Quickstart -
🛠️ API -
⚡️ Examples

---

Quick Start

$3

You can try ViewportGizmo directly in your browser on jsFiddle.

$3

``sh
npm install three-viewport-gizmo
`

$3

`js
import * as THREE from "three";
import { OrbitControls } from "three/addons/controls/OrbitControls.js";
import { ViewportGizmo } from "three-viewport-gizmo";

//... Initialize your Scene

const controls = new OrbitControls(camera, renderer.domElement);
const gizmo = new ViewportGizmo(camera, renderer);

gizmo.attachControls(controls);

// Render
function animation(time) {
//... Scene's animations and render

gizmo.render();
}

// Resize
window.onresize = () => {
//... Scene's resize logic

gizmo.update();
};
``

Acknowledgments

- Thanks to the Three.js community for their amazing work.
- This library was inspired from the official Three.js Viewport Helper.

License

This project is licensed under the MIT License

$3

If you have any questions or need support, feel free to open an issue.

Contributions are welcome! Fork the repository, make your changes, and submit a pull request.