README
Model Renderer
3D model renderer library based on three.js
Installation
You can install this module as npm package using the following command:
npm install --save @3dlook/model-renderer
Example of usage
You need to create a container for canvas renderer
<div class="canvas-container"></div>
And also specify styles for this element
.canvas-container {
width: 1280;
height: 720px;
}
Then you can import ModelRenderer class into your javascript file, create a class instance and init renderer:
import ModelRenderer from '@3dlook/model-renderer';
const renderer = new ModelRenderer({
// container element CSS selector
container: '.canvas-container',
// 3d model url
model: 'https://example.com/3d-model-file.obj',
});
// initialize renderer
renderer.init();
renderer.loadModel()
.then(model => renderer.displayModel(model))
.catch(err => alert(err.message));
API
ModelRenderer
ModelRenderer class
Kind: global class
new ModelRenderer(options)
ModelRenderer constructor
Param | Type | Description |
---|---|---|
options | Object |
options |
modelRenderer.init()
Model render screen initializer
Kind: instance method of ModelRenderer
modelRenderer.loadModel([url])
Load .obj model file
Kind: instance method of ModelRenderer
Param | Type | Description |
---|---|---|
[url] | string |
url to obj file. Default value is set in the constructor options |
modelRenderer.displayModel(object)
Display model on canvas
Kind: instance method of ModelRenderer
Param | Type | Description |
---|---|---|
object | any |
= obj file data |