MMSDT.bindingIcon()
IoT设备图标，绑定到场景中的运动物体上。
Tips: 需先添加IoT图标MMSDT.addIcon()，并控制物体运动actions[arrayIndex][arrayIndex].play()。
构造函数
MMSDT.bindingIcon( name: array, parameters: object, position: function )
name - 包括字符串的数组[运动物体的网格名字,IoT设备的id号]。
parameters - json格式，参数设置。
position - 回调函数，参数为运动物体的实时坐标位置。
代码示例
var MMS3D_exceptionMesh = []; //需要材质拆分的网格
var MMS3D_instancingMesh = []; //合并实例化网格
//初始化场景
MMSDT.initScene( false, MMS3D_exceptionMesh, MMS3D_instancingMesh );
//设置第3人称鼠标控制器
controls3.maxPolarAngle = Math.PI*0.49; //向下，最大角度限制
controls3.maxDistance = 1000; //最远距离限制
controls3.screenSpacePanning = false; //右键平移是否上下移动
controls3.enableDamping = true; //是否开启惯性阻尼
controls3.dampingFactor = 0.1; //惯性阻尼系数
controls3.autoRotateSpeed = 2; //自动旋转速度
//使用json文件让场景还原
MMSDT.onloadScene( "models/mms3D_cangku1.json", function(progress){
if( progress == 'done' ){
//加载完成,播放动画
for( var i=0; i<actions[0].length; i++ ){
actions[0][i].play();
actions[0][i].timeScale = 0.5;
}
//改child的name(因叉车采用的实例，name相同，需重新名称分开)
var lists=1;
models[0].traverse( function ( child ) {
if ( child.isMesh ) {
if( child.name == 'dmxx153_10' ){
child.name = 'car_'+lists;
lists++;
}
}
});
}else if( progress == 'ok' ){
//渲染完成
onloadDone();
}else{
//显示进度条数字
document.getElementById("loadNum").innerHTML = Math.round( progress )+'%';
}
});
//读取json设备信息,载入IoT图标（注意：需在场景加载完之前加载图标；并把图标缩小看不见，后面绑定的时候再放大）
MMSDT.getJson( "models/equip_cangku2.json", function(dataJson){
var options = {
dirUrl: 'models/equip/', //安装目录
scale: 0.01, //缩放比例
height: 15, //相对高度
visible: true, //默认显示
animate: true, //上下浮动
lookAt: true, //是否垂直约束
color: 0x1197ff, //默认颜色
}
new MMSDT.addIcon( dataJson, options);
});
//场景加载完成
function onloadDone(){
MMSDT.coverage( ['B',"C"], 'all' ); //隐藏掉货物的图标（货物后面绑定div ）
//给运动子网格绑定图标（运动子网格模型的名字，需要绑定的图标id号）
var arr = [
[ 'dmxx387', 'H001' ], //货物1
[ 'dmxx279', 'H002' ], //货物2
[ 'dmxx156_3', 'Y001' ], //托盘1
[ 'dmxx386_1', 'Y002' ], //托盘2
[ 'car_1', 'C001' ], //叉车1
[ 'car_2', 'C002' ], //叉车2
]
var offset = {
scale: 200, //设置图标大小（MMSDT.addIcon中的大小*现在大小）
position: [0,10,0], //相对坐标点高度（覆盖MMSDT.addIcon中的坐标偏移x,y,z）
}
MMSDT.bindingIcon( arr, offset, callback ); //执行绑定
//实时返回运动物体的位置坐标
function callback(data){
//把前两个货物绑定div
for( var i=0; i<2; i++ ){
//实时返回运动物体的位置坐标,转换为屏幕二维坐标
let vector = MMSDT.mapped3to2( [data[i].x,data[i].y,data[i].z] );
//坐标点不在视野内，就隐藏div信息
if( vector == 'null' ){
document.getElementsByClassName( 'info' )[i].style.display = 'none';
//坐标点在视野内，就实时改变对应的二维div的位置
}else{
document.getElementsByClassName( 'info' )[i].style.display = 'block';
document.getElementsByClassName( 'info' )[i].style.bottom = vector.y + 10 + "px";
document.getElementsByClassName( 'info' )[i].style.left = vector.x -50 + "px";
}
}
}
}
//自定义对外函数接口------------------------------------------------------------------------
//设备筛选
MMAPI.iotCoverage = function(num ){
switch(num) {
case 0: //全部隐藏
MMSDT.coverage();
break;
case 1: //全部显示
MMSDT.coverage( 'all', 'all' );
break;
case 2: //隐藏货物
MMSDT.coverage( ['B',"C"], 'all' );
break;
case 3: //隐藏叉车
MMSDT.coverage( ['A',"B"], 'all' );
break;
case 4: //隐藏托盘
MMSDT.coverage( ['A',"C"], 'all' );
break;
}
}
点击查看示例演示 →
Powered by mms3D