d43477d726
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.
99 lines
5.1 KiB
HTML
99 lines
5.1 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">
|
|
<link rel="icon" type="image/png" href="assets/images/3dviewer_net_favicon.png">
|
|
|
|
<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>
|
|
div.online_3d_viewer
|
|
{
|
|
float: left;
|
|
border: 1px solid #eeeeee;
|
|
margin: 0px 4px 4px 0px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="online_3d_viewer"
|
|
style="width: 360px; height: 240px;"
|
|
model="../../test/testfiles/3ds/cube_four_instances.3ds,../../test/testfiles/3ds/texture.png">
|
|
</div>
|
|
<div class="online_3d_viewer"
|
|
style="width: 360px; height: 240px;"
|
|
model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/hundred_cubes.mtl">
|
|
</div>
|
|
<div class="online_3d_viewer"
|
|
style="width: 360px; height: 240px;"
|
|
model="../../test/testfiles/3ds/cube_four_instances.3ds,../../test/testfiles/3ds/texture.png"
|
|
camera="3.929421317669367,6.153966358575169,2.7076091223424714,1.5,1.5,0.5,0,0,1">
|
|
</div>
|
|
<div class="online_3d_viewer"
|
|
style="width: 360px; height: 240px;"
|
|
model="../../test/testfiles/obj/hundred_cubes.obj,../../test/testfiles/obj/hundred_cubes.mtl"
|
|
camera="1,1,1,0,0,0,0,0,1">
|
|
</div>
|
|
<div class="online_3d_viewer"
|
|
style="width: 360px; height: 240px;"
|
|
model="wrong.3ds">
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|