Now the viewer's size is based on the parent container's size (not the width and height attribute) so it's possible to style the parent container with css and even use it in fullscreen.
81 lines
4.3 KiB
HTML
81 lines
4.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-126.js"></script>
|
|
<!-- importer 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/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/model/modelentities.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/model.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/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/importer.js"></script>
|
|
<script type="text/javascript" src="../../source/export/exporterutils.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/exporter.js"></script>
|
|
<script type="text/javascript" src="../../source/external/three.converter.js"></script>
|
|
<script type="text/javascript" src="../../source/external/three.model.loader.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/viewer.js"></script>
|
|
<script type="text/javascript" src="../../source/viewer/domviewer.js"></script>
|
|
<!-- importer end -->
|
|
|
|
<script type='text/javascript'>
|
|
OV.Init3DViewerElements ();
|
|
</script>
|
|
|
|
<style>
|
|
html, body
|
|
{
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="online_3d_viewer"
|
|
style="width: 100%; height: 100%;"
|
|
model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/hundred_cubes.mtl"
|
|
camera="3,1,2,0,0,0,0,0,1">
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|