Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
108 changes: 108 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
# Dependency directories
node_modules/
jspm_packages/
three/
.DS_Store
src/example04

# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
lerna-debug.log*

# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage
*.lcov

# nyc test coverage
.nyc_output

# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt

# Bower dependency directory (https://bower.io/)
bower_components

# node-waf configuration
.lock-wscript

# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release


# TypeScript v1 declaration files
typings/

# TypeScript cache
*.tsbuildinfo

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/

# Optional REPL history
.node_repl_history

# Output of 'npm pack'
*.tgz

# Yarn Integrity file
.yarn-integrity

# dotenv environment variables file
.env
.env.test

# parcel-bundler cache (https://parceljs.org/)
.cache

# Next.js build output
.next

# Nuxt.js build / generate output
.nuxt
dist

# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and *not* Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public

# vuepress build output
.vuepress/dist

# Serverless directories
.serverless/

# FuseBox cache
.fusebox/

# DynamoDB Local files
.dynamodb/

# TernJS port file
.tern-port
82 changes: 81 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
@@ -1 +1,81 @@
# threejs-modules
# Copper3D

This library is base on three.js and ami.js.
Current functions:

- Load obj file model
- Load mtl file model
- Load gltf file model
- Load MRI images
- Multiple scenes
- Interacting with MRI images
- Draw circle on MRI images

## How to use:

```
import * as Copper from 'copper3d';
const allScenes = new Copper.Scenes(HTMLElement, 4, {0, 0, 1000});
allScenes.animate();
```

An example for quickly build multiple scenes:

In the HTML file, Vue or React components,
you should create a HTMLElement container for copper3d.
E.g., in index.html

```
<div id="container_root"></div>
```

And the css for container might be:

```
#container_root {
width: 100vw;
height: 100vh;
}
```

In JS:

```
import * as Copper from "copper3d";
const container = document.querySelector("#container_root");
const numberOfScene = 3;
const allScenes = new Copper.Scenes(container, numberOfScene);

const scene1 = allScenes.getScene(0);
const scene2 = allScenes.getScene(1);
const scene3 = allScenes.getScene(2);

Copper.createTestMesh(scene1);
Copper.createTestMesh(scene2);
Copper.createTestMesh(scene3);

allScenes.animate();
```

In the end, you might see this screenshot in your browser:
![how to use Multiple scenes](/doc-screenshorts/01_howtouse.jpg "Create Multiple scenes")

## API Tutorial:

See: https://linkungao.github.io/threejs-modules-1/

## See examples here:

See: https://copper3d-examples.herokuapp.com/

## How to see examples locally:

- cd Copper3D
- npm install
- npm run serve

### The operations for draw circle function

- a. Adjust the MRI image before you draw circle on it.
- b. Enabled draw circle function in GUI panel.
- c. If you draw circle on a wrong position, you can use delete key on your keyboard.
7 changes: 7 additions & 0 deletions babel.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
module.exports = {
presets: ["@babel/preset-env"],
plugins: [
"@babel/plugin-transform-runtime",
"@babel/plugin-proposal-class-properties",
],
};
Loading