---
title: Usage
slug: usage
docTags: 
createdAt: 2022-06-30T08:32:40.000Z
---

To use the Sense of Space geometry streaming in Three.js, you need to include the following script tag in your html in addition to your ThreeJS:

```html
<script src="https://assets.senseofspace.io/streamablemodel/0.0.10/sosStreamableModelThree.js"></script>
```



Now, in your scripts you need to define the following model parameters (described in Supported Parameters):

```javascript
let modelParams = {
"path" : './model.sxrweb',
"useAlpha" : true,
"useMetalRoughness": true,
"occlusionCulling": true,
"equirecEnvMap":'env.jpg',
"doubleSidedMaterials": false,
"quality": 1.0,
"shadows": false
};
```



You can set only some parameters, or skip this part completely (then the streamer will use the default parameters - that are listed in [Supported Parameters](https://docs.senseofspace.io/xXei-supported-parameters)).



Now you can add one or more streamable models to your scene by calling createStreamableModel with your Three.js renderer, scene, camera and optionally your own model parameters as parameters:

```javascript
let object3d = createStreamableModel(renderer, scene, camera, modelParams);
```





After this you need to get the modelStreamer object, which is automatically created when the first streamable model is created, and call its update function inside your render loop. E.g.

```javascript
let modelStreamer = getModelStreamer();
render = function () {
    requestAnimationFrame( render );
    if(modelStreamer !== undefined) {
        modelStreamer.updateFrame();
    }
    // Render the scene
    renderer.render(scene, camera);
};
render();
```





##
