This page details how to control the global settings of VIVERSE Polygon Streaming within your PlayCanas project when using the VIVERSE PlayCanvas extension.
Polygon Streaming project settings are only available when using the VIVERSE of the PlayCanvas editor.
The Stream Controller or Polygon Streaming Settings (VIVERSE SDK) manages the streaming of models and streaming parameters inside your project. It can be found under Viverse Scene Settings.
Camera Type allows you to choose between Player camera or Non-player camera. In case you use an avatar it should be set as a Player camera. In case you use just a viewer camera, without an avatar or character attached, it should be set to Non-player camera.
Next you can customize Occlusion Culling options, it's recommended to keep as default.
The Triangle Budget is a limit on the amount of triangles that will be drawn per frame. Increasing this will lead to better visual quality, but of course also higher processing and memory utilization. It's recommended to keep Triangle Budget to at least 30% of the full amount of polygons that you are going to stream. For example, if you are going to stream a 3D model of 10 million polygons, it's recommended to use a Triangle Budget of at least 3 million.
The Mobile Triangle Budget is the same as Triangle Budget, however it will be applied in case the system identifies the user is visiting the experience via a mobile device.
Minimum Distance and Maximum Quality should be kept as default.
The Distance Factor is a factor between the distance of the camera to the object being streamed. The default value of 1.1 has a neutral preference. A higher value, such as 3 or 5, will have a preference for nearby objects over objects further away. These parameters can be changed at runtime to find the sweet spot for your scene.
The Distance Type can be set to Bounding Box or Bounding Box Center. In case it's set to Bounding Box it will calculate the distance between the camera and object based on the edges of the bounding box of the object. In case it's set to Bounding Box Center, it will calculate the distance from the center of the object. It's recommended to use Bounding Box for single objects, and Bounding Box Center for full environments in which the user will be walking inside the object.
The Close Up Distance is a change in the distance factor between camera and streaming object when the camera gets too close. For example, when the camera is at 3 units or less of distance from the object, it will use the value at Close Up Distance Factor, when the camera is further than 3 units from the object, it will use the value at Distance Factor. That way the system forces a strong streaming of data when the camera is very close to an object.
Details of parameters are also set on the Supported Parameters section.
Camera Type
The viewer camera to be set, the system will calculate distances based on the selected camera.
Player Camera
Occlusion Culling
Enable Dynamic Occlusion Culling.
True
Occlusion Culling Geometry
Mesh: Use the mesh to check if it's occluded Bounding Box: Use the bounding box of the mesh to check if it's occluded.
Bounding Box
Occlusion Query Frequency
Value is in times per second. A value of 0 means will it run on every frame.
8
Triangle Budget
The maximum amount of triangles that you want to be in the scene at any single point.
5000000
Mobile Triangle Budget
The triangle budget used on a mobile device. If it is set to 0 it will use the non-mobile triangle budget.
3000000
Distance Factor
Preference for nearby objects over objects further away. Values above one mean a preference for nearby objects. Values below one mean a preference for objects further away. One is neutral.
1.1
Distance Type
Distance type from camera to the meshes bounding boxes.
Bounding Box
Maximum Quality
Stops improving geometry that exceeds the maximum quality. This can be used to stop far away objects from showing more detail which can be wasteful. Leaving this at 0 means there is no maximum quality.
15000
Close Up Distance
The distance where it starts using close-up distance factor. Set it to 0 to not use close-up distance factor.
3
Close Up Distance Factor
The distance factor used when close-up to an object. Should be higher than the standard distance factor.
5
This page details basic information about using VIVERSE Polygon Streaming with the web-based 3D editor and game engine, PlayCanvas.
Polygon Streaming models can be added to PlayCanvas-based projects with the use of our PlayCanvas Plugin, being able to stream high polygon models from the cloud into your projects and build for the web.
The Polygon Streaming Plugin comes as a zipped file where you can find the PolygonStreaming.js main script. To start using inside PlayCanvas, just drag and drop this script inside your project.
Once the script is imported inside your project, you can already use by following the next guide.
The plugin also comes together with the VIVERSE SDK. In case you are using the SDK. After installing the VIVERSE SDK, a Polygon Streaming Component can be added inside PlayCanvas Engine via the VIVERSE Extension.
Download the latest extension version
Change Log
02/01/2025
2.5.0
Fixed support for latest conversion format
11/12/2024
2.4.9
Updated PS Player to support PlayCanvas Engine 2.0
Support for updated convertor and newly converted models (2.11.1)
[FIX] Unlit materials and small modifications
2.4.7
When running in an iFrame and the build version is viewer it will stop all tasks (rendering, physics, decompression worker, sending traffic info in service worker).
iosMemoryLimit option has been added to stream controller.
2.4.6
Three.js and Babylon.js implementations
Vertex colors for Three.js and Babylon.js
ModelOptions.onLoadedEventHandler has been renamed to onModelLoaded. Affects src/model_scripts/streamable-model.js in VIVERSE Create.
StreamController and it's wrappers are no longer a singletons. Affects src/model_scripts/stream-controller.js in VIVERSE Create.
2.4.4
Fixed KHR_materials_pbrSpecularGlossiness issue.
Added support for vertex colors
Added support for glTF alpha mode
Added support for KHR_materials_unlit
Added support for KHR_materials_emissive_strength
Added support for KHR_materials_sheen
Added support for KHR_materials_dispersion
Can now be installed as a NPM package
Fix KHR_materials_pbrSpecularGlossiness
2.3.7
Fix KHR_materials_pbrSpecularGlossiness
2.3.6
Support KHR_materials_pbrSpecularGlossiness
2.3.5
Support KHR_materials_specular
2.3.4
Backwards compatible with old models
2.3.3
Enable diffuseTint to apply diffuse factor
2.3.2
Revert Local Model
Add Force Double Sided Setting
2.3.1
Signature validation for xrg model
2.3.0
Support KHR extensions
2.2.0
Make streaming model to stream without adding "model.xrg" in the url field
2.1.23
Not blocking streaming if failed to send traffic records
2.1.22
Collect traffics record by service worker
Dispatch onceOptimalRendered
event
2.1.21
Fix missing materials
2.1.20
Fix shared texture release
2.1.19
Use Double Sided from xrgc
Support xrgc version 4
2.1.18
Fix service worker CORS issues in VR browser and Firefox
Use mobile triangle budgets for VR devices
2.1.17
Support xrgc version 3
Variable bit depth for mesh data
Read material doublesidedness from xrgc file
2.1.16
Fixed some nodes not update
2.1.15
Added support PlayCanvas realtime baking texture in PNGs format
2.1.14
Error handling on XRG files with empty nodes
2.1.13
Fix Memory Link in Texture
2.1.12
Light Map Support
Added support for the automatically generated collider.all
2.1.11
Shared Texture Support
2.1.10
Add Occlusion Strength support in playcanvas
2.1.9
Add Initial Triangle Percentage of streaming model to init the model with percentage of Triangle Budget
2.1.8
Support for combined use of Metallic Roughness maps and Ambient Occlusion maps.
2.1.7
Fixed issue where local camera position would be offset if the parent of the streamable model was scaled and camera type was player.
Got node info working in Viverse World.
2.1.6
Fixed issue with multiple stremable models with the same URL which would cause textures to be disposed of when they shouldn't have. Now using unique model ID instead of URL for texture reference keys.
Fixed issue where it wasn't passing on qualityPriority from streamable model component to stream controller.
2.1.5
Reversed previous fix as it was affecting materials that have GLTF property alphaMode set to mask. In the XRG this comes in as opaque and any pixel with an alpha less than 0.9 is not rendered. The conclusion was that this needs to be fixed at source i.e. if the material is transparent it should have alphaMode set to blend.
Fixed an issue where the loading model wasn't been removed if there was more than one streamable model.
2.1.4
Supports for normal and AO maps.
Fixed an issue with diffuse textures with an alpha channel not being visible.
2.1.3
Set FUTURE_CAMERA_POSITION_DURATION to 0
Now uses roughness value as multiplier for roughness-metalness map
Fixed an issue with occlusion culling bounding boxes appearing
This page details how to control the settings of individual VIVERSE Polygon Streaming models within your PlayCanvas project when using the VIVERSE PlayCanvas extension.
Polygon Streaming component settings are only available when using the VIVERSE of the PlayCanvas editor.
The Streamable Model Component or Polygon Streaming (VIVERSE SDK) component represents the model to be streamed inside your project. It will ask for a Polygon Streaming URL, which is the address of your newly converted model. Once you paste the address in that field, it's ready to be streamed inside your scene
The Quality Priority represents the priority of streaming data between multiple components. This means that some models can have higher priority of streaming than others, it can use only integer numbers and it works in the following logic:
Use Alpha should be checked if your model has transparency or uses alpha in their materials or textures.
Use MetalRoughness should be checked to use the model's MetalRoughness values, in case it's unchecked the model will be unlit. For both options, the default is always On.
Cast Shadows, Cast Lightmap Shadows and Receive Shadows should be checked in order for the model to cast and receive shadows.
Double Sided Materials should be checked in case the model was designed to use double sided materials.
Initial Triangle Percentage is the percentage of the amount of triangles to be first shown in the scene. This means that if you wish to show the model only when it's updated to highest level you can set it to 1.
Environment Asset allows to set a custom environment map to use for the streamed model. If no environment asset is set, it will use the environment of the scene itself.
Polygon Streaming URL
Path of the streamable mode to be streamed into the project.
./model.xrg
Quality Priority
How much to prioritize the quality of this model relative to the quality of other models in the scene. This parameter does nothing if this is the only model in the scene.
1
Use Alpha
Keep on if the model uses any alpha information or transparency.
On
Use MetalRoughness
Keep at on if the model uses PBR materials. Off in case of unlit models.
On
Cast Shadows
Keep on in case the model needs to cast shadow.
On
Cast Lightmap Shadows
Keep on in case the model needs to cast lightmap shadows.
On
Receive Shadows
Keep on in case the model needs to receive shadows.
On
Double Sided Materials
Turn on in case the model needs double sided materials.
Off
Initial LOD
Override the LOD that the model initially loads.
-1
Environment Asset
Use either a cubemap asset with a prefiltered image or the prefiltered image as a texture asset
Empty
Initial triangle percentage
Percentage of triangle budget for initially load the model
0.5
Layers
What layers to render the model
Empty
This page guides you through the three options available for using VIVERSE Polygon Streaming with PlayCanvas: with the VIVERSE PlayCanvas Extension, as standalone, or with HTML scripting.
Start by opening your PlayCanvas project and setup using the VIVERSE Extension. Once the extension is setup and you’re logged in, you are ready to add special components. To add a Polygon Streaming component to the scene, add an Empty component to the scene and give a name like "Streaming Model".
With the new component selected, click on EDIT VIVERSE EXTENSION. Choose a Media type of plugin, select the module PolygonStreaming and click the plus + symbol. Now you just added a Polygon Streaming component to your scene.
Paste the Asset ID of your streaming model into the Polygon Streaming URL field. Once you added the URL in the field, the object will preview inside your scene. This is just a preview; once Published, the streaming model will start actively streaming from the cloud.
That’s all you need to stream your models inside your VIVERSE Scene. You can also modify the Polygon Streaming Parameters going to Viverse Scene Settings / Polygon Streaming and change the parameters according to your preferences. You can check the Supported Parameters list below in this documentation.
After you published your VIVERSE World scene, the Streaming Model will automatically start to stream inside the scene.
Once you have the Polygon Streaming main script imported to your project. Start by creating a new empty entity into your scene. Give it the name "StreamController" and add a Script component to the entity.
Choose the StreamController script option and that will open all the options to control your streaming models inside your project. You can check detailed information on these parameters in the Stream Controller section of this guide.
Create a new empty entity and this time give the name "Streamable Model". Add a new Script component to the entity and this time choose the "streamableModel" script option. This will create the component to stream your model inside the scene.
Paste the URL address of your streaming model into the "Path or url to model" field. Once you added the URL in the field, the object will already preview inside your scene. This is just a preview, once the scene is Launched or Published, the streaming model will start actively streaming from the cloud.
After you published your VIVERSE World scene, the Streaming Model will automatically start to stream inside your scene.
In this section, we're going to go through how to implement PlayCanvas Plugin directly in HTML.
0
Highest Priority
1
Lowest Priority
2+
Higher Priority from the previous number, but still Lower Priority than 0 (zero).