在普通浏览模式下，很多的操作例如控制可视性，控制视图定位都需要选中一个独立的3D对象。在普通浏览模式下，tuo-visual提供了两个界面来选中3D对象。一个是通过3D视图直接选中对象，一个是通过对象树形结构视图来选中对象。
通过3D视图选择对象的优点是直观，容易理解。而通过树形结构视图来选中对象的优点是可以从结构层面上选择3D对象或者对象分组。这两个视图的都会通过一定ui的效果来表示一个对象被选中的状态。
在3D视图中，tuo-visual的前端应用会用黄色轮廓线来表示一个对象被鼠标hover的状态，并会用绿色外轮廓线来表示一个对象被选中的状态。这些外轮廓能把一个对象被隐藏的轮廓也标识出来，让用户能够更好观察一个对象在整体上所处的空间位置。请看如下动图：
同样我们可以通过树形结构视图来选择对象或分组，树形结构视图与3D视图ui效果也是同步的，请看下图演示：
在移动端的3D视图中做选中操作时，我们通过单指点触屏幕来实现。即在触摸屏上单指点一下屏幕后立刻松开。操作方式如下图所示：
浏览大型装配体时，我们通常需要将一些零件隐藏掉。tuo-visual系统提供了两个方式来控制零件的可视性。第一是通过底部工具栏的形式，第二是通过树形结构视图的控制按钮。在底部工具栏当我们选中过对象时，或者存在被隐藏对象时就会出现一个可视性控制图标，通过此图标展开后的子按钮，即可控制零件的可视性。
下面是通过树形结构视图来操作对象的可视性：
可以看到，通过树形结构视图，我们除了能以一个3D对象为操作单位外，还能以一个分组为操作单位。
浏览大型装配体时，定位视图的浏览角度和中心是非常重要的。tuo-visual为此也提供了直观有效的视图控制方案。
第一，可以通过tuo-visual底部工具栏的视图控制图标所展开的按钮来控制3D视图定位中心。如下图所示：
第二，我们还可以通过3D视图右上的小立方体控件来控制视图方向。操作示例如下图所示：
浏览大型装配体时，为了更好的分析装配体结构，用户时常需要移动一些零件的位置。tuo-visual前端应用允许用户在移动操作模式下可以通过鼠标或者触摸屏做装配体的拆解操作：
触摸屏下操作也十分便利：
tuo-visual的历史记录缓存会记录最多128次可记录的操作，目前可记录操作包括3D对象的移动操作和可视性操作。并提供对这些操作的回溯和返回下一步操作。
tuo-visual除了提供对3D模型的各种浏览工具以外，还提供了高精度的分析工具。我们可以通过这些工具对模型做在线的分析。tuo-visual提供的模型分析是基于CAD文件中几何原型实现的，目前tuo-visual1.0版本的分析功能已经能支持6种几何原型，它们包括：点，直线，圆弧，平面，圆柱面和球面。通过tuo-visual提供的分析功能，我们能分析这些几何体之间和其自身的一些数据。下表列出了当前所支持的所有分析功能
| 点 | 直线 | 圆弧 | 平面 | 圆柱面 | 球面 | 其他 | |
| 点 | 距离 | 距离 | 点到中心距离 | 距离 | 点到中轴线距离 | 点到球心距离 | 无 |
| 直线 | 距离 | 距离 | 直线到中心距离 | 直线到平行平面的距离 | 直线到中轴线的距离 | 直线到球心距离 | 线段长度 |
| 圆弧 | 点到中心距离 | 中心到直线距离 | 中心到中心距离 | 中心到平面距离 | 中心到中轴线的距离 | 中心到球心距离 | 半径长度 |
| 平面 | 距离 | 直线到平行平面的距离 | 中心的距离 | 平行间平面的距离 | 平面到中轴线的距离 | 平面到球心的距离 | 无 |
| 圆柱面 | 点到中轴线距离 | 直线到中轴线距离 | 中心到中轴线距离 | 平面到平行中轴线的距离 | 中轴线到中轴线距离 | 中轴线到球心距离 | 半径长度 |
| 球面 | 点到球心距离 | 直线到球心距离 | 中心到球心的距离 | 平面到球心的距离 | 中轴线到球心距离 | 球心到球心距离 | 半径长度 |
当用户通过底部工具栏的几何分析图标进入几何分析模式后，每当用户选中一定数量的几何特征，底部工具栏的几何分析图片就能展开当前可以分析的数据按钮。用户只需要点击相应按钮即可分析相应几何数据。如下图所示：
在上图演示中，我们选中了两个圆柱面，下面的测量图标展开按钮就出现了3个分析按钮：半径长度，圆柱中轴线距离和点到点距离（点到点距离是指一开始点击到的圆柱面上的空间位置），然后我们点了“圆柱中轴线距离”的按钮后成功的测量出了发动机内部两个相临气缸的中心距离。
为了配合几何分析功能，我们还提供了相应的选择过滤工具来帮助用户更好的选择几何单位。如下图所示：
当我们点击几何选择过滤工具上的一个按钮时，该按钮就会变色。当其变为灰色时，其所对应的几何元素就无法被选中。这里的工具栏从上到下所对应的几何元素分别是点，线和面。上图中，对应“线”的按钮为灰色，即表示3D视图中的“线”无法被用户选中。
tuo-visual的前端应用界面从区块上大致分3个部分，模型树形结构视图，模型3D视图和底部工具栏。如下图所示：
在屏幕较小的设备（如手机），左侧的模型树形结构视图会成为可收缩的样式，如下图所示：
模型的树形结构视图通过有层次的树形结构来表达模型装配体的组成结构。原CAD文件中的模型名称会也在这里表示出来。这些树形结构都是可展开可回收的，如下图所示：
树形结构视图中，每个条目含有两个元素，一个是其所指模型的名称，一个是该模型的可视性。我们可以用鼠标点击可视性控制图标切换该模型的可视性。如下图所示：
上图也演示了我们可以通过树形结构对不同层级分组的模型进行可视性操作。
对于树形结构视图还有一个特征就是，当我们鼠标放在某个条目上时，其父元素也会表示性ui效果提示，这个功能可以帮助我们快速区分模型的分组情况。如下图所示：
模型的3D视图部分除了显示对模型的3D渲染视图外还提供视角控制操作，3D视角导航工具，和右侧选择控制工具栏。
对于3D视图的视角控制，在移动端（触摸屏操作）和pc端（鼠标操作）分别提供了不同的方案，说明如下：
鼠标操作：
操作演示如下图所示：
触摸屏操作：
操作演示如下图所示：
3D视图中的视图导航工具是我们独立研发的交互引擎tuo-three2的一个插件，它能一方面直观的表达当前浏览模型的角度另一方面用户也能通过它来设定当前视角。请看如下演示动态图片。
当我们的前端应用处于几何体分析模式下时，3D视图的右侧还会出现选择控制工具栏。通过这个选择控制工具栏，我们可以过滤选中3D视图中的几何元素。例如根据用户实际操作需求，我们可以设定只允许选择点，线或者面。
我们通过以下动图来描述此选择过滤操作。
前端应用的底部工具栏是前端各种主要操作的接入点。它包括可视性工具，视图定位工具，历史操作记录控制工具，移动工具和几何分析工具。
底部工具栏拥有一个自身的按钮容器控制机制，每个按钮只有当它有效的时候才会出现。例如 ，移动，测量等一些专门针对3D零件的操作，在普通预览模式下，其所对应的按钮只会在有3D对象被选中时才会出现。如下图所示：
底部工具栏所有的控制按钮都是可以往上展开的树形拓展结构，采用这种设计主要是为了保持界面的简洁性。下文将分别介绍底部5个工具展开后的形态：
1. 可视性工具。当我们在普通浏览模式下选中某个3D对象时，此工具按钮就会出现在底部工具栏。随后，如果我们让鼠标光标停放在该按钮上或者触摸该按钮，其子操作按钮就会出现在该按钮的正上方。如下图所表示：
注：其中“显示所有已被隐藏对象”的按钮需要存在被隐藏对象时，才会出现。
2. 视图定位工具。此工具无论在什么模式下都会出现在底部工具栏。它能控制整体的视图定位。其子按钮介绍如下图所示：
注：其中“定位到被选中对象视图”按钮需要存在被选中对象时才会出现
3. 历史操作记录控制按钮。此按钮是操作历史记录的接入口，通过此按钮我们能够执行“撤销上一步”操作或者“返回下一步”操作。其子按钮分布情况如下图所示：
注：此按钮和其子按钮只有存在可以追溯的操作历史记录时才会出现
4 移动工具按钮。此按钮是进入“移动操作模式”和对3D对象进行移动操作的接口，通过此按钮我们可以对被选中的单一对象做平移，旋转和放缩变形。其子按钮分布情况如下图所示：
注：“退出移动模式”按钮，只会在进入移动模式后才会出现。
5. 几何分析按钮。此按钮是进入几何分析模式和提供各种几何分析操作的接入口。此按钮会在“普通浏览模式“和“几何分析模式”模式下出现。在“普通浏览模式”下，其子按钮只有一个，即“进入几何分析模式”按钮。如下图所示：
当进入“几何分析模式”后，其子按钮的分布情况如下图所示：
上图所表示的“当前可执行分析操作”的按钮是根据当前用户所选中的几何元素而定的，本系统支持的所有几何分析操作所对应图标如下：
几何分析的子按钮中，还可能出现一个“清除所有标注”的按钮，此按钮在应用中存在标注信息的时候会出现。如下图所示：
