项目中总结出一些常见问题,顺便熟悉开发中出现的
API
;
smartBridge's tips:
操作iframe后点击模型后出现的闪烁问题
解决方法: 改变焦点事件
-
在模型队形的html上加入
onmouseover="changeFocus()"
; -
js中定义并执行一个无意义的点击操作
function changeFocus() { $('.test').click(); }
视图中定位方法的实现
需要定位到的位置坐标(x,y,z)
function position(x, y, z) {
var vec3 = VirtualRealityCtrl.UtilManager.CreateInstance("Vertex");//创建病害坐标;
vec3.X = x;
vec3.Y = y;
vec3.Z = z;
var normalview = VirtualRealityCtrl.ViewerManager.GetView(0); //拿到标准视图对象
normalview.SetPosition(vec3, 80, 1);//以标准视图的视角定位到视图的中心点(坐标,高度,过渡时间)
}
植入模型后无法释放工具,反复添加
给定一个标识状态(目前不知道为什么加了就可以了)
var flagModel = false; //给定一个状态
{
//模型添加触发事件
flagModel = true;
//获取到模型的url = ??
VirtualRealityCtrl.ToolManager.ActiveTool = 5; //切换为点击事件
VirtualRealityCtrl.attachEvent("ToolEvent", ToolEventAddModel); //ar注册事件
}
function ToolEventAddModel(id, type, data) {
var obj = JSON.parse(data);
if (flagModel) {
AR.Tool.AddModel(url, obj[1]); //obj[1]是坐标信息集合
flagModel = false;
}
if (obj.ID != "") {
VirtualRealityCtrl.ToolManager.ReleaseActiveTool(); //释放点击的状态
}
}
视图中添加"模型"(非种植的)一些操作
这里用智慧桥梁中的病害信息为例
- 创建
实际上病害的创建是创建文本模型
var txt = VirtualRealityCtrl.ModelManager.CreateTextModelParam();
var vec3 = VirtualRealityCtrl.UtilManager.CreateInstance("Vertex");
vec3.X = x;
vec3.Y = y;
vec3.Z = z;
txt.Position = vec3;
txt.Text = t;
txt.ImagePath = basePath + imgUrl;
var mod = VirtualRealityCtrl.ModelManager.CreateTextModel(txt); //创建传感器说明
mod.ShowDirScreen = true; //是否显示说明文字
VirtualRealityCtrl.LayerManager.ModelLayer.AddNode(mod); //添加到展示层
arr.push({
KeyId: item[i].KeyId, //keyID是用于非文本模型操作的标识(依据此的请求等)
ModId: mod.ID //mod.ID是获取该文本模型的标识
});
- 删除
依赖于创建时三维视图中的唯一标识ID
if (arr != null) {
for (var i = 0; i < arr.length; i++) {
var model = VirtualRealityCtrl.LayerManager.GetModelNodeByID(arr[i].ModId);
if (model != null) {
VirtualRealityCtrl.LayerManager.ModelLayer.DeleteNode(model);
}
}
arr = [];
}
- 依据自定义
iD
字段请求
在注册事件中进行判断当前操作的文本模型是哪一个
mod.id
?? 然后通过这个再拿到keyId
发起网络请求
VirtualRealityCtrl.attachEvent("ToolEvent", ToolEvents); //AR中的注册事件
function ToolEvents(id, type, data) {
var obj = JSON.parse(data);
if (type == "5") {
//其他操作
$.ajax({
type: "GET",
url: "../data/JsonData/timeMachine.json",
success: function (data) {
//其他操作
}
}
}
绘制挡板(面)
思路:通过将工具
type=4
,调出绘面工具,然后在注册事件中拿到对应的点的坐标
- 拼接新的数组
function ToolEvents(id, type, data) {
var obj = JSON.parse(data);//data为数组坐标合集
if (type == "4") {
for (var i = 0; i < obj.length; i++) {
var tem = []
if (i < obj.length - 1) {
tem = [obj[i], obj[i + 1]]
} else {
tem = [obj[i], obj[0]]
}
bottomPoint.push(tem)
}
VirtualRealityCtrl.ToolManager.ActiveTool = 0;
drawFace();
}
}
//当时出现的问题在于:创建的时候把pgParam、vec3放在了循环外面
function drawFace() {
for (var i = 0; i < bottomPoint.length; i++) {
var pgParam = VirtualRealityCtrl.ModelManager.CreatePolygonModelParam(); //创建线面
var vec3 = VirtualRealityCtrl.UtilManager.CreateInstance("Vertex");
for (var j = 0; j < bottomPoint[i].length; j++) {
vec3.X = bottomPoint[i][j].X;
vec3.Y = bottomPoint[i][j].Y;
vec3.Z = bottomPoint[i][j].Z;
pgParam.AddVertex(vec3);
}
var temArr = bottomPoint[i].reverse();
for (var k = 0; k < temArr.length; k++) { //坐标变换
vec3.X = temArr[k].X;
vec3.Y = temArr[k].Y;
vec3.Z = temArr[k].Z + 5;
pgParam.AddVertex(vec3);
}
pgParam.FillColor = 03333; //添加其他属性
pgParam.ShowSide = true;
pgParam.SideColor = 03333;
pgParam.SideWidth = 2;
var plmodel = VirtualRealityCtrl.ModelManager.CreatePolygonModel(pgParam);
plmodel.Transparency = 0.5;
VirtualRealityCtrl.LayerManager.ModelLayer.AddNode(plmodel);//添加到场景中
temArr = []; //清空临时数组
}
bottomPoint = [];
}
vue 复选框的使用
-
单个复选框用于绑定布尔值
<input type="checkbox" id="" v-model="checked"> <!-- checked = "true" or "false" -->
-
多个复选框用于绑定数组(传入value值入数组)
<input type="checkbox" id="a" value="John" v-model="checkedNames"> <label for="a">John</label> <input type="checkbox" id="b" value="Mike" v-model="checkedNames"> <label for="b">Mike</label> <!-- checkedNames为选中复选框的input对应value值的集合 -->
IE11 下注册事件的兼容设置
Internet Explorer 11 默认情况下不支持 attachEvent 注册事件,需要在页面中修改默认兼容设置为IE10 才能使用 attachEvent 注册事件。 head中添加:
<meta http-equiv="X-UA-Compatible" content="IE=10" />