Add the possibility to add environment map to self-hosted viewer.

This commit is contained in:
kovacsv 2021-07-20 21:08:02 +02:00
parent 7b33f773ed
commit e49bd60561
2 changed files with 39 additions and 8 deletions

View File

@ -93,6 +93,15 @@
style="width: 360px; height: 240px;" style="width: 360px; height: 240px;"
model="../../test/testfiles/gltf/Box/glTF-Draco/Box.gltf,../../test/testfiles/gltf/Box/glTF-Draco/Box.bin"> model="../../test/testfiles/gltf/Box/glTF-Draco/Box.gltf,../../test/testfiles/gltf/Box/glTF-Draco/Box.bin">
</div> </div>
<div class="online_3d_viewer"
style="width: 360px; height: 240px;"
model="../../test/testfiles/gltf/DamagedHelmet/glTF-Binary/DamagedHelmet.glb">
</div>
<div class="online_3d_viewer"
style="width: 360px; height: 240px;"
model="../../test/testfiles/gltf/DamagedHelmet/glTF-Binary/DamagedHelmet.glb"
environmentmap="../website/assets/envmaps/fishermans_bastion/posx.jpg,../website/assets/envmaps/fishermans_bastion/negx.jpg,../website/assets/envmaps/fishermans_bastion/posy.jpg,../website/assets/envmaps/fishermans_bastion/negy.jpg,../website/assets/envmaps/fishermans_bastion/posz.jpg,../website/assets/envmaps/fishermans_bastion/negz.jpg">
</div>
</body> </body>
</html> </html>

View File

@ -1,5 +1,9 @@
OV.Init3DViewerElement = function (parentDiv, modelUrls, camera, backgroundColor, defaultColor) OV.Init3DViewerElement = function (parentDiv, modelUrls, parameters)
{ {
if (!parameters) {
parameters = {};
}
let canvas = document.createElement ('canvas'); let canvas = document.createElement ('canvas');
parentDiv.appendChild (canvas); parentDiv.appendChild (canvas);
@ -33,8 +37,8 @@ OV.Init3DViewerElement = function (parentDiv, modelUrls, camera, backgroundColor
return true; return true;
}); });
viewer.AdjustClippingPlanes (boundingSphere); viewer.AdjustClippingPlanes (boundingSphere);
if (camera !== null) { if (parameters.camera) {
viewer.SetCamera (camera); viewer.SetCamera (parameters.camera);
} else { } else {
viewer.SetUpVector (importResult.upVector, false); viewer.SetUpVector (importResult.upVector, false);
} }
@ -61,13 +65,17 @@ OV.Init3DViewerElement = function (parentDiv, modelUrls, camera, backgroundColor
return null; return null;
} }
if (backgroundColor !== null) { if (parameters.backgroundColor) {
viewer.SetBackgroundColor (backgroundColor); viewer.SetBackgroundColor (parameters.backgroundColor);
}
if (parameters.environmentMap) {
viewer.SetEnvironmentMap (parameters.environmentMap);
} }
let settings = new OV.ImportSettings (); let settings = new OV.ImportSettings ();
if (defaultColor !== null) { if (parameters.defaultColor) {
settings.defaultColor = defaultColor; settings.defaultColor = parameters.defaultColor;
} }
loader.LoadFromUrlList (modelUrls, settings); loader.LoadFromUrlList (modelUrls, settings);
@ -99,13 +107,27 @@ OV.Init3DViewerElements = function (onReady)
defaultColor = OV.ParameterConverter.StringToColor (defaultColorParams); defaultColor = OV.ParameterConverter.StringToColor (defaultColorParams);
} }
let environmentMap = null;
let environmentMapParams = element.getAttribute ('environmentmap');
if (environmentMapParams) {
let environmentMapParts = environmentMapParams.split (',');
if (environmentMapParts.length === 6) {
environmentMap = environmentMapParts;
}
}
let modelUrls = null; let modelUrls = null;
let modelParams = element.getAttribute ('model'); let modelParams = element.getAttribute ('model');
if (modelParams) { if (modelParams) {
modelUrls = OV.ParameterConverter.StringToModelUrls (modelParams); modelUrls = OV.ParameterConverter.StringToModelUrls (modelParams);
} }
return OV.Init3DViewerElement (element, modelUrls, camera, backgroundColor, defaultColor); return OV.Init3DViewerElement (element, modelUrls, {
camera,
backgroundColor,
defaultColor,
environmentMap
});
} }
let viewerElements = []; let viewerElements = [];