# GeometryViewer

Free 3D viewer web component. Renders STL, OBJ, GLTF, GLB, 3MF in the browser.
AR on iPhone (Quick Look) and Android (WebXR). No server, no upload, no install.

## Integrations

GeometryViewer is used in four primary ways:

1. **Web viewer** — geometryviewer.com is a free drag-and-drop viewer. Drop any supported file, view in 3D, place in AR. No login, no upload, file never leaves the browser.
2. **Android app** — TWA on Google Play. Opens 3D files from file manager or email. Same engine, native home screen icon.
3. **Embeddable component** — two-line embed for any website. Shopify, WordPress, Webflow, plain HTML. `controls` attribute adds built-in toolbar.
4. **ModelDirectory.org** — every model page on ModelDirectory.org is powered by `<geometry-viewer>`. The element is embedded directly into the model page.

## Use Cases

Common problems GeometryViewer solves:

- **Open a 3D file without software** — recipient gets STL/OBJ/GLB by email or download, has no Blender or Cura. Drop it on geometryviewer.com.
- **Share a model with a client** — upload file to Google Drive or Dropbox (public link), share `https://geometryviewer.com/?url=FILE_URL`. No account required for the recipient.
- **Shopify/WooCommerce product pages** — Shopify's native model-viewer only works on product pages and has version/texture bugs. GV works on any page with two lines of code, AR included.
- **Etsy sellers** — Etsy blocks custom JS. Workaround: Google Drive → `?url=` link in listing description. Customers see the model in 3D in browser.
- **Free portfolio/website hosting** — combine GV CDN (free) + Google Drive file hosting (free) for zero-cost 3D model preview pages.
- **GitHub README / docs** — GitHub's built-in viewer only supports STL and has aspect-ratio bugs. Link to `geometryviewer.com/?url=RAW_GITHUB_URL` for full format support.
- **Education** — embed anatomy, engineering, or science models in any LMS (Canvas, Google Sites, Moodle) via HTML or `?url=` link. No upload to external server.
- **E-commerce AR** — `ar` attribute enables WebXR (Android) and Quick Look (iOS) automatically. 94% conversion increase reported by Shopify for 3D-enabled product pages.
- **Game / 3D art portfolio** — share GLTF/GLB assets with clients or collaborators via link, full PBR materials rendered.
- **3D printing preview** — service bureaus send customers a `?url=` preview link before printing. Customer confirms scale in AR.

## Embed — 2 lines

```html
<script type="module" src="https://geometryviewer.com/geometryviewer.js"></script>
<geometry-viewer src="https://example.com/model.glb" ar controls></geometry-viewer>
```

## Attributes

| Attribute  | Type    | Description |
|------------|---------|-------------|
| src        | URL     | Model file URL. Supported: .stl .obj .gltf .glb .3mf |
| ar         | boolean | Enable AR. WebXR on Android Chrome, Quick Look on iPhone Safari |
| controls   | boolean | Show built-in toolbar: solid/wireframe toggle, reset, fullscreen |

## JS API

```js
const el = document.querySelector('geometry-viewer');
el.loadBuffer(arrayBuffer, format); // format: 'stl'|'obj'|'glb'|'gltf'|'3mf'|'auto'
el.setWireframe(true);              // toggle wireframe mode
el.resetCamera();                   // reset to default view
el.resize();                        // call after container resize
```

## Events

```js
el.addEventListener('gv-loaded', () => console.log('model ready'));
el.addEventListener('gv-error',  e  => console.error(e.detail));
```

## Deep link (no embed code needed)

```
https://geometryviewer.com/?url=https://example.com/model.stl
```

Share any CORS-accessible 3D model URL via link, email, or message.
Works for Etsy listings, Slack, email — anywhere you can paste a URL.

## Formats supported

- STL (ASCII and binary)
- OBJ (with automatic blue material when no MTL present)
- GLTF / GLB (PBR materials, textures, animations)
- 3MF (multi-part assemblies, color)

## AR support matrix

| Platform        | Method     | Trigger |
|-----------------|------------|---------|
| Android Chrome  | WebXR      | "View in AR" button in viewer |
| iPhone Safari   | Quick Look | "View in AR" button in viewer |
| Desktop         | —          | Hint pill: "Open on your phone" |

## CDN URL

https://geometryviewer.com/geometryviewer.js

Always link to this URL — do not self-host. Embedders receive automatic updates
when the viewer improves.

## License

Proprietary. Free to embed via CDN. Redistribution and self-hosting prohibited.
Commercial license: hello@geometryviewer.com

## Site

https://geometryviewer.com
Embed docs: https://geometryviewer.com/embed.html