@i3yun/viewergallery
Version:
BIM轻量化平台是一个互联网三维可视化解决方案。包括BIM轻量化引擎和业务组件。
91 lines (84 loc) • 4.02 kB
HTML
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<title>新剖分Demo - BIM轻量化平台</title>
<script type="text/javascript" src="http://bimviewer.aisanwei.cn/viewer/SippreepViewer.bundle.js"></script>
<!-- <script type="text/javascript" src="../../dist/release/viewer/SippreepViewer.bundle.js"></script> -->
<style>
.my-custom-ui {
position: absolute;
top: 0;
left: 0;
z-index: 5;
margin: .3em;
padding: .3em;
font-size: 1em;
font-family: sans-serif;
background-color: rgba(255, 255, 255, 0.85);
border-radius: 8px;
}
.my-custom-ui span {
color: red;
}
.ToolMode {
color: black;
}
.PickMode {
color: red;
}
</style>
</head>
<body style="margin: 0px;">
<div class="my-custom-ui">
<fieldset>
<legend>场景配置</legend>
模型数据库<input id="DATABASE" type="text" value="http://bimdb.aisanwei.cn" /> 场景
<input id="SCENEID" type="text" value="P2006200001" />
<button id="updateScene">加载场景</button>
<div>场景状态: <span id="sceneState"></span></div>
</fieldset>
<fieldset>
<legend>三维操控</legend>
<button class="ToolMode" data="0">选择</button>
<button class="ToolMode" data="1">平移</button>
<button class="ToolMode" data="3">旋转</button>
<button class="ToolMode" data="4">漫游</button>
<button class="ToolMode" data="6">环视</button>
<button class="ToolMode" data="8">框选</button>
<div>选中项: <span id="MySelectionValue">0</span></div>
</fieldset>
<fieldset>
<legend>三维操控</legend>
<div><span id="MySelectionValue">先选择切的方式，左键（按下->抬起）放置切面</span></div>
<div>
<button class="PickMode" data="0" title="沿X轴正方向切">切世界左面</button>
<button class="PickMode" data="1" title="沿X轴负方向切">切世界右面</button>
<button class="PickMode" data="2" title="沿Y轴正方向切">切世界前面</button>
<button class="PickMode" data="3" title="沿Y轴负方向切">切世界后面</button>
<button class="PickMode" data="4" title="沿Z轴正方向切">切世界下面</button>
<button class="PickMode" data="5" title="沿Z轴负方向切">切世界上面</button>
</div>
<div>
<button class="PickMode" data="6" title="沿屏幕X轴正方向切">切屏幕左面</button>
<button class="PickMode" data="7" title="沿屏幕X轴负方向切">切屏幕右面</button>
<button class="PickMode" data="8" title="沿屏幕Y轴正方向切">切屏幕下面</button>
<button class="PickMode" data="9" title="沿屏幕Y轴负方向切">切屏幕上面</button>
</div>
<div>
<button class="PickMode" data="10" title="碰撞面">切对象碰撞面</button>
<button class="PickMode" data="11" title="碰撞面">切对象碰撞反面</button>
</div>
<div>
<button id="clearLastPlane">清除上一次切</button>
<button id="clearPlanes">清除全部切</button>
</div>
</fieldset>
</div>
<div id="viewer1"> </div>
<script src="index.js"></script>
</body>
</html>