https://github.com/gtalarico/vue-threejs-rhino-demo

Rhino 3dm Three Js viewer
https://github.com/gtalarico/vue-threejs-rhino-demo

rhino3d rhino3dm rhinocommon rhinocompute threejs vuejs

Last synced: 8 days ago
JSON representation

Rhino 3dm Three Js viewer

• Host: GitHub
• URL: https://github.com/gtalarico/vue-threejs-rhino-demo
• Owner: gtalarico
• License: mit
• Created: 2019-09-02T22:15:17.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-11T04:08:08.000Z (almost 2 years ago)
• Last Synced: 2024-05-04T00:22:02.433Z (6 months ago)
• Topics: rhino3d, rhino3dm, rhinocommon, rhinocompute, threejs, vuejs
• Language: JavaScript
• Homepage: https://vue-threejs-rhino-viewer.netlify.com/
• Size: 6.8 MB
• Stars: 49
• Watchers: 8
• Forks: 8
• Open Issues: 22
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Vue ThreeJS Rhino Viewer Demo

This is a demo project to test Rhino3dm & Compute integration with Three JS.

I created this project to test and learn how these new technologies were designed to work,

and to generate boiler plate code for use in future projects.

It uses [resources and samples provided by McNeel here](https://github.com/mcneel/rhino3dm/blob/master/samples/javascript/rhinologo.html) for the basic setup,

but also build on it with more reusable modules and new JS syntax.

The application bootstrapping and [loading sequence of dependencies](https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src/rhinoService.js#L7) in the [context of a Vue application](https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src/components/Scene.vue#L49) was a bit tricky but seems to be working well.

[**Live Demo**](https://vue-threejs-rhino-viewer.netlify.com/)

(Requires Rhino Compute Token, get yours [here](https://www.rhino3d.com/compute/login))

### What's included

* A minimal VueJs project setup using Vue CLI

* My preferred setup for [loading ThreeJS into a Vue project](https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src/three) and [setting up a configurable Scene ](https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src/three/environment.js)

* A [RhinoService module](https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src/rhinoService.js) for making handling auth, Rhino Compute calls, and converting objects to a renderable object (eg. Brep to Meshes)

* Samples [ThreeJs encoders]((https://github.com/gtalarico/vue-threejs-rhino-demo/blob/master/src//three/encoders.js)) to convert renderable Rhino Objects into ThreeJs equivalents (eg. Meshes, NurbsCurve, LineCurve, etc)

![demo-screenshot](https://github.com/gtalarico/vue-threejs-rhino-demo/raw/master/rhino-viewer.gif)

![demo-screenshot-2](https://github.com/gtalarico/vue-threejs-rhino-demo/raw/master/rhino-viewer-2.gif)

### Contributing

Contributions of any kind are welcome, including UI improvement, additional encoders, application setup, etc

## Local Development

```

$ yarn install

$ yarn run serve

```

**License MIT**