ModelHandle/sandbox/embed_selfhost_code.html
2021-12-30 10:16:49 +01:00

136 lines
7.3 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no">
<title>Online 3D Viewer</title>
<script type="text/javascript" src="../../libs/three.min.js"></script>
<!-- engine start -->
<script type="text/javascript" src="../source/core/core.js"></script>
<script type="text/javascript" src="../source/core/taskrunner.js"></script>
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>
<script type="text/javascript" src="../source/geometry/matrix.js"></script>
<script type="text/javascript" src="../source/geometry/transformation.js"></script>
<script type="text/javascript" src="../source/geometry/tween.js"></script>
<script type="text/javascript" src="../source/io/binaryreader.js"></script>
<script type="text/javascript" src="../source/io/binarywriter.js"></script>
<script type="text/javascript" src="../source/io/textwriter.js"></script>
<script type="text/javascript" src="../source/io/bufferutils.js"></script>
<script type="text/javascript" src="../source/io/fileutils.js"></script>
<script type="text/javascript" src="../source/io/externallibs.js"></script>
<script type="text/javascript" src="../source/model/material.js"></script>
<script type="text/javascript" src="../source/model/triangle.js"></script>
<script type="text/javascript" src="../source/model/property.js"></script>
<script type="text/javascript" src="../source/model/object.js"></script>
<script type="text/javascript" src="../source/model/mesh.js"></script>
<script type="text/javascript" src="../source/model/meshbuffer.js"></script>
<script type="text/javascript" src="../source/model/node.js"></script>
<script type="text/javascript" src="../source/model/meshinstance.js"></script>
<script type="text/javascript" src="../source/model/model.js"></script>
<script type="text/javascript" src="../source/model/topology.js"></script>
<script type="text/javascript" src="../source/model/meshutils.js"></script>
<script type="text/javascript" src="../source/model/modelutils.js"></script>
<script type="text/javascript" src="../source/model/modelfinalization.js"></script>
<script type="text/javascript" src="../source/model/quantities.js"></script>
<script type="text/javascript" src="../source/model/generator.js"></script>
<script type="text/javascript" src="../source/import/importerutils.js"></script>
<script type="text/javascript" src="../source/import/importerbase.js"></script>
<script type="text/javascript" src="../source/import/importerobj.js"></script>
<script type="text/javascript" src="../source/import/importerstl.js"></script>
<script type="text/javascript" src="../source/import/importeroff.js"></script>
<script type="text/javascript" src="../source/import/importerply.js"></script>
<script type="text/javascript" src="../source/import/importer3ds.js"></script>
<script type="text/javascript" src="../source/import/importergltf.js"></script>
<script type="text/javascript" src="../source/import/importero3dv.js"></script>
<script type="text/javascript" src="../source/import/importerthree.js"></script>
<script type="text/javascript" src="../source/import/importersvg.js"></script>
<script type="text/javascript" src="../source/import/importer3dm.js"></script>
<script type="text/javascript" src="../source/import/importerifc.js"></script>
<script type="text/javascript" src="../source/import/filelist.js"></script>
<script type="text/javascript" src="../source/import/importer.js"></script>
<script type="text/javascript" src="../source/export/exportermodel.js"></script>
<script type="text/javascript" src="../source/export/exporterbase.js"></script>
<script type="text/javascript" src="../source/export/exporterobj.js"></script>
<script type="text/javascript" src="../source/export/exporterstl.js"></script>
<script type="text/javascript" src="../source/export/exporterply.js"></script>
<script type="text/javascript" src="../source/export/exporteroff.js"></script>
<script type="text/javascript" src="../source/export/exportergltf.js"></script>
<script type="text/javascript" src="../source/export/exporter3dm.js"></script>
<script type="text/javascript" src="../source/export/exporter.js"></script>
<script type="text/javascript" src="../source/threejs/threeutils.js"></script>
<script type="text/javascript" src="../source/threejs/threeconverter.js"></script>
<script type="text/javascript" src="../source/threejs/threemodelloader.js"></script>
<script type="text/javascript" src="../source/parameters/parameterlist.js"></script>
<script type="text/javascript" src="../source/viewer/domutils.js"></script>
<script type="text/javascript" src="../source/viewer/navigation.js"></script>
<script type="text/javascript" src="../source/viewer/viewergeometry.js"></script>
<script type="text/javascript" src="../source/viewer/viewer.js"></script>
<script type="text/javascript" src="../source/viewer/measuretool.js"></script>
<script type="text/javascript" src="../source/viewer/embeddedviewer.js"></script>
<!-- engine end -->
<style>
div.online_3d_viewer
{
float: left;
border: 1px solid #eeeeee;
width: 640px;
height: 480px;
}
</style>
<script type='text/javascript'>
window.addEventListener ('load', () => {
// get the parent element of the viewer
let parentDiv = document.getElementById ('viewer');
// initialize the viewer with the parent element and some parameters
let viewer = new OV.EmbeddedViewer (parentDiv, {
camera : new OV.Camera (
new OV.Coord3D (-1.5, -3.0, 2.0),
new OV.Coord3D (0.0, 0.0, 0.0),
new OV.Coord3D (0.0, 0.0, 1.0)
),
backgroundColor : new OV.Color (255, 255, 255),
defaultColor : new OV.Color (200, 200, 200),
edgeSettings : {
showEdges : false,
edgeColor : new OV.Color (0, 0, 0),
edgeThreshold : 1
},
environmentMap : [
'../website/assets/envmaps/grayclouds/posx.jpg',
'../website/assets/envmaps/grayclouds/negx.jpg',
'../website/assets/envmaps/grayclouds/posy.jpg',
'../website/assets/envmaps/grayclouds/negy.jpg',
'../website/assets/envmaps/grayclouds/posz.jpg',
'../website/assets/envmaps/grayclouds/negz.jpg'
]
});
// load a model providing model urls
viewer.LoadModelFromUrls ([
'../../test/testfiles/obj/hundred_cubes.obj',
'../../test/testfiles/obj/hundred_cubes.mtl'
]);
});
</script>
</head>
<body>
<div class="online_3d_viewer" id="viewer">
</div>
</body>
</html>