TIM 3D is a Three.js based interactive manual builder. It loads 3D files and builds a manual out of them.
npm install tim3dThis example shows a basic manual. A more interactive and comprehensive manual can be found on the webpage.
First, initialise the instance with the config object. The definitions of what can be set are available on the docs website.
import { Factory } from 'tim3d';
const div = document.getElementById('container');
const config = {
container: div,
colors: {
backgroundColor: '#123456'
}
};
const manual = new Factory(config);Next, create an object with files and step definitions. With these, then create an instance using loadJSON method.
const json = {
files: [
{
id: 'cube_id',
file: './path/to/cube.obj'
}
// Other files
],
steps: [
{
name: 'First Step',
positions: [
{
id: 'cube_id',
pose: {
position: [10, 0, 0]
}
}
]
}
// Other steps
]
};
// Load the uploaded object with file and step definitions
manual.loadJSON(json);More precise definition of the json object with more in-depth fields can be found on the docs website.
Build a non-production version of the library
npm run buildBuild a production version of the library
npm run build:prodStarts a Webpack live sever, automatically builds the library and exposes it to localhost
npm run devPerforms an ESLint check
npm run lint:checkTries to fix solvable ESLint errors
npm run lint:fixScans all files and checks if they are corresponding to the Prettier config
npm run prettier:checkScans all files and updates them with the correct Prettier config
npm run prettier:writeGenerates documentation from the whole library
npm run docs:gen👤 Matej Hakoš
- Github: @mattjoke
- Twitter: @matt_joke1
- LinkedIn: Matej Hakoš
Give a ⭐️ if this project helped you!
Copyright © 2022 Matej Hakoš.
This project is Apache--2.0 licensed.