添加继电器界面动画，修改继电器显示模式
This commit is contained in:
sunzhenyu
parent
57db66b6c2
commit
a9a62b924f
@ -2,6 +2,8 @@
|
||||
export function Jdqcontrol(){
|
||||
let scope = this;
|
||||
|
||||
this.devicelist = [];
|
||||
|
||||
this.jdqinit = function(){
|
||||
|
||||
}
|
||||
@ -10,5 +12,81 @@ export function Jdqcontrol(){
|
||||
|
||||
}
|
||||
|
||||
this.jdqdevicelist = function(selectmodel){
|
||||
if(scope.devicelist.length>0){
|
||||
scope.devicelist = [];
|
||||
}
|
||||
for(let i=0,leni=selectmodel.children.length;i<leni;i++){
|
||||
let part= {
|
||||
name:selectmodel.children[i].name,
|
||||
text:null,
|
||||
mesh:selectmodel.children[i],
|
||||
index:i,
|
||||
show:true,
|
||||
};
|
||||
if(selectmodel.children[i].name == "dizuo"){
|
||||
part.text = "底座";
|
||||
selectmodel.children[i].text = "底座";
|
||||
}
|
||||
if(selectmodel.children[i].name == "cigang"){
|
||||
part.text = "磁钢";
|
||||
selectmodel.children[i].text = "磁钢";
|
||||
}
|
||||
if(selectmodel.children[i].name == "Lxing"){
|
||||
part.text = "L型轭铁";
|
||||
selectmodel.children[i].text = "L型轭铁";
|
||||
}
|
||||
if(selectmodel.children[i].name == "jiaoxingxiantie"){
|
||||
part.text = "角型衔铁";
|
||||
selectmodel.children[i].text = "角型衔铁";
|
||||
}
|
||||
if(selectmodel.children[i].name == "xianquan"){
|
||||
part.text = "线圈";
|
||||
selectmodel.children[i].text = "线圈";
|
||||
}
|
||||
if(selectmodel.children[i].name == "zhongchuipian"){
|
||||
part.text = "重锤片";
|
||||
selectmodel.children[i].text = "重锤片";
|
||||
}
|
||||
if(selectmodel.children[i].name == "lagan"){
|
||||
part.text = "拉杆";
|
||||
selectmodel.children[i].text = "拉杆";
|
||||
}
|
||||
if(selectmodel.children[i].name == "dongjiedianzhou"){
|
||||
part.text = "动接点轴";
|
||||
selectmodel.children[i].text = "动接点轴";
|
||||
}
|
||||
if(selectmodel.children[i].name == "neibu"){
|
||||
part.text = "内部";
|
||||
selectmodel.children[i].text = "内部";
|
||||
}
|
||||
if(selectmodel.children[i].name == "jiedian"){
|
||||
part.text = "节点";
|
||||
selectmodel.children[i].text = "节点";
|
||||
}
|
||||
if(selectmodel.children[i].name == "yapian"){
|
||||
part.text = "压片";
|
||||
selectmodel.children[i].text = "压片";
|
||||
}
|
||||
if(selectmodel.children[i].name == "fanghuozhao"){
|
||||
part.text = "防火罩";
|
||||
selectmodel.children[i].text = "防火罩";
|
||||
}
|
||||
if(selectmodel.children[i].name == "dianyuanpian"){
|
||||
part.text = "电源片";
|
||||
selectmodel.children[i].text = "电源片";
|
||||
}
|
||||
if(selectmodel.children[i].name == "xinpian"){
|
||||
part.text = "电路板";
|
||||
selectmodel.children[i].text = "电路板";
|
||||
}
|
||||
if(selectmodel.children[i].name =="jueyuanzhou"){
|
||||
part.text = "绝缘轴";
|
||||
selectmodel.children[i].text = "绝缘轴";
|
||||
}
|
||||
|
||||
scope.devicelist.push(part);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -4,43 +4,210 @@ export function Moveanimate(){
|
||||
|
||||
this.animatelist = [];
|
||||
|
||||
this.enable = false;
|
||||
this.enable = true;
|
||||
|
||||
this.initanimate = function(modelobject,points,type){
|
||||
this.initlist = function(modellist){
|
||||
// let points = [];
|
||||
// points.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
// points.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
// scope.initanimate(modellist[j].children[i],modellist[j].name+"select1",points,true);
|
||||
console.log(modellist);
|
||||
for(let j=0,lenj=modellist.length;j<lenj;j++){
|
||||
for(let i=0,leni=modellist[j].children.length;i<leni;i++){
|
||||
|
||||
if(modellist[j].children[i].name == "dizuo"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-150));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dizuoon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-150));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dizuooff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "Lxing"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-50,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"Lxingon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-50,modellist[j].children[i].position.z));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"Lxingoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "jiaoxingxiantie"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z+25));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jiaoxingxiantieon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z+25));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jiaoxingxiantieoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "xianquan"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-100,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"xianquanon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-100,modellist[j].children[i].position.z));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"xianquanoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "zhongchuipian"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-25,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"zhongchuipianon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+25,modellist[j].children[i].position.z));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"zhongchuipianoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "lagan"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z+50));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"laganon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z+50));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"laganoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "dongjiedianzhou"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z+25));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dongjiedianzhouon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z+25));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dongjiedianzhouoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "neibu"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-50));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"neibuon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-50));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"neibuoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "jiedian"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z-15));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jiedianon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z-15));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jiedianoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "yapian"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z-25));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"yapianon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z-25));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"yapianoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "fanghuozhao"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z+200));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"fanghuozhaoon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z+200));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"fanghuozhaooff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "dianyuanpian"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-50));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dianyuanpianon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z-50));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"dianyuanpianoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name == "xinpian"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+150,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"xinpianon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+150,modellist[j].children[i].position.z));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"xinpianoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name =="jueyuanzhou"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jueyuanzhouon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y+100,modellist[j].children[i].position.z));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"jueyuanzhouoff",points2,true);
|
||||
}
|
||||
if(modellist[j].children[i].name =="cigang"){
|
||||
let points1 = [];
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
points1.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-100,modellist[j].children[i].position.z+100));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"cigangon",points1,true);
|
||||
let points2 = [];
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y-100,modellist[j].children[i].position.z+100));
|
||||
points2.push(new THREE.Vector3(modellist[j].children[i].position.x,modellist[j].children[i].position.y,modellist[j].children[i].position.z));
|
||||
scope.initanimate(modellist[j].children[i],modellist[j].name+"cigangoff",points2,true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
this.initanimate = function(modelobject,name,points,type){
|
||||
let curve = new THREE.CatmullRomCurve3(points);
|
||||
|
||||
let animate = {
|
||||
name:modelobject.name,
|
||||
name:name,
|
||||
curve:curve,
|
||||
progress:0,
|
||||
directchange:false,
|
||||
connectmodel:modelobject,
|
||||
enable:true,
|
||||
enable:false,
|
||||
status:"start",
|
||||
speed:,
|
||||
speed:0.05,
|
||||
};
|
||||
scope.animatelist.push(animate);
|
||||
scope.animatelist[name] = animate;
|
||||
}
|
||||
|
||||
this.animateupdate = function(){
|
||||
if(scope.enable){
|
||||
for(let i=0,leni=scope.amimatelist.length;i<leni;i++){
|
||||
if(scope.animatelist[i].enable){
|
||||
// console.log(camerarail.progress);
|
||||
if(scope.animatelist[i].progress>=0.99){
|
||||
scope.animatelist[i].enable = false;
|
||||
scope.animatelist[i].status = "end";
|
||||
}else{
|
||||
let point = scope.animatelist[i].curve.getPointAt(scope.animatelist[i].progress);
|
||||
|
||||
scope.animatelist[i].connectmodel.position.x = point.x;
|
||||
scope.animatelist[i].connectmodel.position.y = point.y;
|
||||
scope.animatelist[i].connectmodel.position.z = point.z;
|
||||
if(scope.animatelist[i].directchange){
|
||||
let tangent = scope.animatelist[i].curve.getPointAt(scope.animatelist[i].progress+0.001);
|
||||
// scope.animatelist[i]
|
||||
if(scope.enable){
|
||||
// console.log(scope.enable);
|
||||
for(let k in scope.animatelist){
|
||||
if(scope.animatelist[k].enable){
|
||||
console.log(scope.animatelist[k].progress);
|
||||
if(scope.animatelist[k].progress>=0.99){
|
||||
scope.animatelist[k].enable = false;
|
||||
scope.animatelist[k].status = "end";
|
||||
scope.animatelist[k].progress = 0;
|
||||
}else{
|
||||
let point = scope.animatelist[k].curve.getPointAt(scope.animatelist[k].progress);
|
||||
console.log(scope.animatelist[k].progress);
|
||||
scope.animatelist[k].connectmodel.position.x = point.x;
|
||||
scope.animatelist[k].connectmodel.position.y = point.y;
|
||||
scope.animatelist[k].connectmodel.position.z = point.z;
|
||||
if(scope.animatelist[k].directchange){
|
||||
let tangent = scope.animatelist[k].curve.getPointAt(scope.animatelist[k].progress+0.001);
|
||||
// scope.animatelist[k]
|
||||
tangent = null;
|
||||
}
|
||||
scope.animatelist[i].progress += 0.003;
|
||||
scope.animatelist[k].progress += scope.animatelist[k].speed;
|
||||
point = null;
|
||||
|
||||
}
|
||||
|
||||
@ -1,13 +1,44 @@
|
||||
var Staticmodel = {
|
||||
Jdq: {
|
||||
Jdq1: {
|
||||
id: "1",
|
||||
name: "继电器",
|
||||
name: "继电器1700",
|
||||
deviceType: "jdq1700",
|
||||
type: "training",
|
||||
picUrl: "",
|
||||
assetUrl: "../../static/model/jdq/jdq1700.FBX"
|
||||
},
|
||||
Jdq2: {
|
||||
id: "1",
|
||||
name: "继电器1000",
|
||||
deviceType: "jdq",
|
||||
type: "training",
|
||||
picUrl: "",
|
||||
assetUrl: "../../static/model/jdq/jdq.FBX"
|
||||
assetUrl: "../../static/model/jdq/jdq1000.FBX"
|
||||
},
|
||||
Jdq3: {
|
||||
id: "1",
|
||||
name: "继电器h18",
|
||||
deviceType: "jdq",
|
||||
type: "training",
|
||||
picUrl: "",
|
||||
assetUrl: "../../static/model/jdq/jdqh18.FBX"
|
||||
},
|
||||
Jdq4: {
|
||||
id: "1",
|
||||
name: "继电器480",
|
||||
deviceType: "jdq",
|
||||
type: "training",
|
||||
picUrl: "",
|
||||
assetUrl: "../../static/model/jdq/jdq480.FBX"
|
||||
},
|
||||
Jdqg:{
|
||||
id: "0",
|
||||
name: "继电器柜",
|
||||
deviceType: "jdqg",
|
||||
type: "training",
|
||||
picUrl: "",
|
||||
assetUrl: "../../static/model/jdq/jdqg.FBX"
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export { Staticmodel }
|
||||
|
||||
@ -4,57 +4,50 @@ import { FBXLoader } from '@/jlmap3d/main/loaders/FBXLoader';
|
||||
import { OrbitControls } from '@/jlmap3d/main/control/OrbitControls';
|
||||
|
||||
import { ModelManager } from '@/jlmap3d/jl3ddevicetrain/loader.js';
|
||||
import { Moveanimate } from '@/jlmap3d/jl3ddevicetrain/component/moveanimate.js';
|
||||
import { Jdqcontrol } from '@/jlmap3d/jl3ddevicetrain/component/jdqcontrol.js';
|
||||
// import { Signallightload } from '@/jlmap3d/jl3ddevice/component/signallight.js';
|
||||
|
||||
// import StompClient from '@/utils/sock';
|
||||
import {Stats} from '@/jlmap3d/main/lib/stats.min.js';
|
||||
|
||||
var clock = new THREE.Clock();
|
||||
export function Jl3ddevice(dom,group,token) {
|
||||
var scope = this;
|
||||
export function Jl3ddevice(dom) {
|
||||
let scope = this;
|
||||
|
||||
let helpbox,textplane;
|
||||
this.dom = dom;
|
||||
this.nowcode = null;
|
||||
this.animateswitch = false;
|
||||
this.mixers = [];
|
||||
this.showmodel = null;
|
||||
//场景状态
|
||||
this.status = 0;
|
||||
//动画状态
|
||||
this.animastats = false;
|
||||
//初始化webgl渲染
|
||||
let renderer = new THREE.WebGLRenderer({ antialias: true,alpha: true });
|
||||
renderer.setPixelRatio( window.devicePixelRatio );
|
||||
renderer.setSize(dom.offsetWidth, dom.offsetHeight);
|
||||
renderer.shadowMap.enabled = true;
|
||||
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
|
||||
// renderer.shadowMap.enabled = true;
|
||||
// renderer.shadowMap.type = THREE.PCFSoftShadowMap;
|
||||
renderer.setClearColor( 0x000000, 0 );
|
||||
this.dom.appendChild(renderer.domElement);
|
||||
|
||||
//定义相机
|
||||
|
||||
let camera = new THREE.PerspectiveCamera(70, dom.offsetWidth / dom.offsetHeight, 0.01, 5000);
|
||||
camera.position.set(0, 20, 2500);
|
||||
camera.position.set(-1000, 1500, 0);
|
||||
camera.aspect = dom.offsetWidth / dom.offsetHeight;
|
||||
camera.updateProjectionMatrix();
|
||||
|
||||
this.controls = new THREE.OrbitControls(camera, dom);
|
||||
// this.controls.maxPolarAngle = Math.PI / 2;
|
||||
// this.controls.minPolarangle = Math.PI / 5;
|
||||
this.controls.maxDistance = 4800;
|
||||
this.controls.target = new THREE.Vector3(500,1000,0);
|
||||
this.controls.update();
|
||||
//定义场景(渲染容器)
|
||||
let scene = new THREE.Scene();
|
||||
scene.background = new THREE.Color(0xa0a0a0);
|
||||
|
||||
// var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 20000, 20000 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
// mesh.rotation.x = - Math.PI / 2;
|
||||
// mesh.receiveShadow = true;
|
||||
// scene.add( mesh );
|
||||
//
|
||||
// var grid = new THREE.GridHelper( 5000, 100, 0x000000, 0x000000 );
|
||||
// grid.material.opacity = 0.2;
|
||||
// grid.material.transparent = true;
|
||||
// scene.add( grid );
|
||||
|
||||
|
||||
|
||||
//定义全局光
|
||||
let ambientLight = new THREE.AmbientLight(0xffffff, 1.3);
|
||||
scene.add(ambientLight);
|
||||
@ -62,6 +55,20 @@ export function Jl3ddevice(dom,group,token) {
|
||||
var light = new THREE.HemisphereLight( 0xffffff, 0x444444 );
|
||||
light.position.set( 0, 200, 0 );
|
||||
scene.add( light );
|
||||
|
||||
// var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
// mesh.position.x = 10000;
|
||||
// mesh.rotation.x = - Math.PI / 2;
|
||||
// mesh.receiveShadow = true;
|
||||
|
||||
|
||||
var grid = new THREE.GridHelper( 1000, 20, 0x000000, 0x000000 );
|
||||
grid.material.opacity = 0.2;
|
||||
grid.material.transparent = true;
|
||||
grid.position.x = 10000;
|
||||
|
||||
scene.add( grid );
|
||||
// scene.add( mesh );
|
||||
//
|
||||
// var spotLight = new THREE.SpotLight(0xffffff);
|
||||
// spotLight.position.set(0, 3000, 0);
|
||||
@ -73,6 +80,165 @@ export function Jl3ddevice(dom,group,token) {
|
||||
|
||||
|
||||
this.selectmodel = null;
|
||||
|
||||
this.updateselect = function(updata){
|
||||
console.log(updata);
|
||||
if(helpbox){
|
||||
scene.remove( helpbox );
|
||||
helpbox = null;
|
||||
}
|
||||
helpbox = new THREE.BoxHelper( updata.mesh, 0xff0000 );
|
||||
console.log(updata.mesh);
|
||||
let point = {
|
||||
x:updata.mesh.matrixWorld.elements[12],
|
||||
y:updata.mesh.matrixWorld.elements[13],
|
||||
z:updata.mesh.matrixWorld.elements[14]
|
||||
};
|
||||
settext(updata.mesh,point)
|
||||
// moveanima.animatelist[scope.selectmodel.name+"select1"].enable = true;
|
||||
// console.log(intersects[0].object);
|
||||
scene.add( helpbox );
|
||||
}
|
||||
this.backselect = function(){
|
||||
console.log(scope.modelmanager.controllist);
|
||||
scope.modelmanager.controllist[0].position.set(19,1270,-165);
|
||||
scope.modelmanager.controllist[0].rotation.y = -Math.PI/2;
|
||||
scope.modelmanager.controllist[0].rotation.z = -Math.PI/2;
|
||||
|
||||
scope.modelmanager.controllist[1].position.set(19,1270,-55);
|
||||
scope.modelmanager.controllist[1].rotation.y = -Math.PI/2;
|
||||
scope.modelmanager.controllist[1].rotation.z = -Math.PI/2;
|
||||
|
||||
scope.modelmanager.controllist[2].position.set(19,1270,65);
|
||||
scope.modelmanager.controllist[2].rotation.y = -Math.PI/2;
|
||||
scope.modelmanager.controllist[2].rotation.z = -Math.PI/2;
|
||||
|
||||
scope.modelmanager.controllist[3].position.set(19,1270,170);
|
||||
scope.modelmanager.controllist[3].rotation.y = -Math.PI/2;
|
||||
scope.modelmanager.controllist[3].rotation.z = -Math.PI/2;
|
||||
|
||||
camera.position.set(-1000, 1500, 0);
|
||||
scope.controls.target = new THREE.Vector3(500,1000,0);
|
||||
scope.controls.update();
|
||||
scope.status = '0';
|
||||
if(textplane){
|
||||
scene.remove(textplane);
|
||||
textplane.geometry.dispose();
|
||||
textplane.material.dispose();
|
||||
}
|
||||
scope.selectmodel = null;
|
||||
scope.jdqcontrol.devicelist = [];
|
||||
updatemenulist(scope.jdqcontrol.devicelist);
|
||||
};
|
||||
|
||||
this.disperdevice = function(){
|
||||
console.log(scope.status);
|
||||
console.log(scope.animastats);
|
||||
if(scope.status == '1'){
|
||||
if(scope.animastats == false){
|
||||
scope.animastats = true;
|
||||
for(let i=0,leni=scope.selectmodel.children.length;i<leni;i++){
|
||||
|
||||
if(scope.selectmodel.children[i].name == "dizuo"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dizuoon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "Lxing"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"Lxingon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "jiaoxingxiantie"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jiaoxingxiantieon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "xianquan"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"xianquanon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "zhongchuipian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"zhongchuipianon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "lagan"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"laganon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "dongjiedianzhou"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dongjiedianzhouon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "neibu"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"neibuon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "jiedian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jiedianon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "yapian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"yapianon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "fanghuozhao"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"fanghuozhaoon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "dianyuanpian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dianyuanpianon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "xinpian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"xinpianon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name =="jueyuanzhou"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jueyuanzhouon"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name =="cigang"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"cigangon"].enable = true;
|
||||
}
|
||||
}
|
||||
} else if(scope.animastats == true){
|
||||
scope.animastats = false;
|
||||
for(let i=0,leni=scope.selectmodel.children.length;i<leni;i++){
|
||||
|
||||
if(scope.selectmodel.children[i].name == "dizuo"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dizuooff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "Lxing"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"Lxingoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "jiaoxingxiantie"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jiaoxingxiantieoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "xianquan"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"xianquanoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "zhongchuipian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"zhongchuipianoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "lagan"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"laganoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "dongjiedianzhou"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dongjiedianzhouoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "neibu"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"neibuoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "jiedian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jiedianoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "yapian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"yapianoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "fanghuozhao"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"fanghuozhaooff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "dianyuanpian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"dianyuanpianoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name == "xinpian"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"xinpianoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name =="jueyuanzhou"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"jueyuanzhouoff"].enable = true;
|
||||
}
|
||||
if(scope.selectmodel.children[i].name =="cigang"){
|
||||
moveanima.animatelist[scope.selectmodel.name+"cigangoff"].enable = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
//
|
||||
// let teststomp = new StompClient();
|
||||
// let topic = '/user/topic/simulation/assistant/'+group;
|
||||
@ -97,29 +263,22 @@ export function Jl3ddevice(dom,group,token) {
|
||||
let stats = new Stats();
|
||||
dom.appendChild( stats.dom );
|
||||
|
||||
document.addEventListener( "mousedown", onselect, false );
|
||||
|
||||
window.onresize = function () {
|
||||
camera.aspect = scope.dom.offsetWidth / scope.dom.offsetHeight;
|
||||
camera.updateProjectionMatrix();
|
||||
renderer.setSize(scope.dom.offsetWidth, scope.dom.offsetHeight);
|
||||
}
|
||||
this.jdqcontrol = new Jdqcontrol();
|
||||
|
||||
let moveanima = new Moveanimate();
|
||||
|
||||
this.anime = null;
|
||||
|
||||
this.modelmanager = new ModelManager();
|
||||
this.modelmanager.loadpromise(Staticmodel, scope.mixers).then(function (data) {
|
||||
let object = scope.modelmanager.jdq.mesh;
|
||||
for(let i=0,leni=object.children.length;i<leni;i++){
|
||||
if(object.children[i].name == "waizhao"){
|
||||
for(let j=0,lenj=object.children[i].children.length;j<lenj;j++){
|
||||
if(object.children[i].children[j].name == "waizhao"){
|
||||
object.children[i].children[j].material.depthTest = false;
|
||||
}
|
||||
}
|
||||
// object.children[i].position.y = 1000;
|
||||
}
|
||||
}
|
||||
object.position.y = -500;
|
||||
scene.add(object);
|
||||
this.modelmanager.loadpromise(Staticmodel, scope.mixers,scene).then(function (data) {
|
||||
moveanima.initlist( scope.modelmanager.controllist);
|
||||
animate();
|
||||
})
|
||||
|
||||
@ -128,9 +287,135 @@ export function Jl3ddevice(dom,group,token) {
|
||||
|
||||
scope.anime = requestAnimationFrame(animate);
|
||||
renderer.render(scene, camera);
|
||||
moveanima.animateupdate();
|
||||
// scope.controls.update();
|
||||
stats.update();
|
||||
}
|
||||
|
||||
function onselect(event){
|
||||
if(event.button == '0'){
|
||||
if(scope.status == '0'){
|
||||
let raycaster = new THREE.Raycaster();
|
||||
//定义平面鼠标点击坐标
|
||||
let mouse = new THREE.Vector2();
|
||||
mouse.x = (event.clientX / dom.offsetWidth) * 2 - 1;
|
||||
mouse.y = -(event.clientY / dom.offsetHeight) * 2 + 1;
|
||||
|
||||
raycaster.setFromCamera( mouse, camera );
|
||||
for(let i=0,leni=scope.modelmanager.controllist.length;i<leni;i++){
|
||||
let intersects = raycaster.intersectObjects( scope.modelmanager.controllist[i].children,true);
|
||||
|
||||
if(intersects[0]){
|
||||
scope.modelmanager.controllist[i].position.set(10000,0,0);
|
||||
scope.modelmanager.controllist[i].rotation.y = 0;
|
||||
scope.modelmanager.controllist[i].rotation.z = 0;
|
||||
camera.position.set(10800, 500, 0);
|
||||
scope.controls.target = new THREE.Vector3(10000,0,0);
|
||||
scope.jdqcontrol.jdqdevicelist(scope.modelmanager.controllist[i]);
|
||||
updatemenulist(scope.jdqcontrol.devicelist);
|
||||
scope.controls.update();
|
||||
scope.selectmodel = scope.modelmanager.controllist[i];
|
||||
scope.status = '1';
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
if(scope.status == '1'){
|
||||
|
||||
//定义光线
|
||||
let raycaster = new THREE.Raycaster();
|
||||
//定义平面鼠标点击坐标
|
||||
let mouse = new THREE.Vector2();
|
||||
mouse.x = (event.clientX / dom.offsetWidth) * 2 - 1;
|
||||
mouse.y = -(event.clientY / dom.offsetHeight) * 2 + 1;
|
||||
|
||||
raycaster.setFromCamera( mouse, camera );
|
||||
|
||||
|
||||
let intersects = raycaster.intersectObjects( scope.modelmanager.controllist,true);
|
||||
|
||||
if(intersects[0]){
|
||||
if(helpbox){
|
||||
scene.remove( helpbox );
|
||||
helpbox = null;
|
||||
}
|
||||
if(intersects[0].object.raycastoff){
|
||||
helpbox = new THREE.BoxHelper( intersects[0].object.parent, 0xff0000 );
|
||||
settext(intersects[0].object.parent,intersects[0].point);
|
||||
}else{
|
||||
helpbox = new THREE.BoxHelper( intersects[0].object, 0xff0000 );
|
||||
settext(intersects[0].object,intersects[0].point);
|
||||
}
|
||||
scene.add( helpbox );
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
function settext(intersects,point){
|
||||
console.log(intersects);
|
||||
if(intersects.text){
|
||||
let textgeometry = new THREE.PlaneBufferGeometry( 600, 400, 1 );
|
||||
let textt = new THREE.CanvasTexture(getTextCanvas(intersects.text));
|
||||
let textmaterial = new THREE.MeshBasicMaterial( {
|
||||
side: THREE.DoubleSide,
|
||||
map:textt ,transparent: true,
|
||||
alphaTest:0.1
|
||||
} );
|
||||
if(textplane){
|
||||
scene.remove(textplane);
|
||||
textplane.geometry.dispose();
|
||||
textplane.material.dispose();
|
||||
}
|
||||
textplane= new THREE.Mesh( textgeometry, textmaterial );
|
||||
// textplane.name = data[i].code;
|
||||
textplane.position.x = point.x;
|
||||
textplane.position.y = point.y+200;
|
||||
textplane.position.z = point.z;
|
||||
// console.log(textplane.position);
|
||||
// textplane.tcode = data[i].code;
|
||||
textplane.rotation.y = -Math.PI/2;
|
||||
textplane.lookAt(camera.position);
|
||||
// scope.textlist.push(textplane);
|
||||
// newmesh.children[0].add(textplane);
|
||||
scene.add(textplane);
|
||||
textgeometry.dispose();
|
||||
textmaterial.dispose();
|
||||
textt.dispose();
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
var beauty = new Image();
|
||||
beauty.src = "../../static/texture/guide.png";
|
||||
//canvas文字贴图方法
|
||||
//PS:待提炼 增强功能
|
||||
function getTextCanvas(text){
|
||||
var canvas = document.getElementById('canvastexture');
|
||||
|
||||
canvas.width = 512;
|
||||
canvas.height = 256;
|
||||
|
||||
var ctx = canvas.getContext('2d');
|
||||
|
||||
//var bg = canvas.createPattern(img, "no-repeat");
|
||||
//ctx.fillStyle = bg;
|
||||
ctx.fillRect(0, 0,512,256);
|
||||
ctx.font = "40px Verdana";
|
||||
ctx.fillStyle = '#FFFFFF';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.textBaseline = 'middle';
|
||||
ctx.clearRect(0,0,512,256);
|
||||
//console.log(text.groupNumber);
|
||||
ctx.drawImage(beauty,0,0,512, 256);
|
||||
ctx.fillText("设备部件:"+text, 200,64);
|
||||
// ctx.fillText("车组人员:XXX", 40,20);
|
||||
// ctx.fillText("速度:XXX.XXX", 40,30);
|
||||
//ctx.fillText(text.trainModel.name, width/2,height*3/4);
|
||||
let data = ctx.getImageData(0, 0,512, 256);
|
||||
return data;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -3,22 +3,87 @@
|
||||
export function ModelManager(){
|
||||
let scope = this;
|
||||
|
||||
this.jdq = {
|
||||
code:null,
|
||||
this.controllist = [];
|
||||
let jdq1 = {
|
||||
code:jdq1,
|
||||
locateType:"01",
|
||||
mesh:null,
|
||||
action:null
|
||||
};
|
||||
let jdq2 = {
|
||||
code:jdq2,
|
||||
locateType:"01",
|
||||
mesh:null,
|
||||
action:null
|
||||
};
|
||||
let jdq3 = {
|
||||
code:jdq3,
|
||||
locateType:"01",
|
||||
mesh:null,
|
||||
action:null
|
||||
};
|
||||
let jdq4 = {
|
||||
code:jdq4,
|
||||
locateType:"01",
|
||||
mesh:null,
|
||||
action:null
|
||||
};
|
||||
|
||||
|
||||
this.jdqg = {
|
||||
code:null,
|
||||
locateType:"00",
|
||||
mesh:null,
|
||||
action:null
|
||||
};
|
||||
|
||||
this.loadpromise = function (data,mixers){
|
||||
|
||||
|
||||
|
||||
this.loadpromise = function (data,mixers,scene){
|
||||
let initlist = [];
|
||||
initlist.push(fbxpromise(data.Jdq,mixers,scope.jdq));
|
||||
initlist.push(fbxpromise(data.Jdq1,mixers,jdq1));
|
||||
initlist.push(fbxpromise(data.Jdq2,mixers,jdq2));
|
||||
initlist.push(fbxpromise(data.Jdq3,mixers,jdq3));
|
||||
initlist.push(fbxpromise(data.Jdq4,mixers,jdq4));
|
||||
initlist.push(fbxpromise(data.Jdqg,mixers,scope.jdqg));
|
||||
|
||||
return new Promise(function(resolve, reject){
|
||||
|
||||
Promise.all(initlist).then((result) => {
|
||||
jdq1.mesh.position.x = 19;
|
||||
jdq1.mesh.position.z = -165;
|
||||
jdq1.mesh.position.y = 1270;
|
||||
jdq1.mesh.rotation.y = -Math.PI/2;
|
||||
jdq1.mesh.rotation.z = -Math.PI/2;
|
||||
|
||||
jdq2.mesh.position.x = 19;
|
||||
jdq2.mesh.position.z = -55;
|
||||
jdq2.mesh.position.y = 1270;
|
||||
jdq2.mesh.rotation.y = -Math.PI/2;
|
||||
jdq2.mesh.rotation.z = -Math.PI/2;
|
||||
|
||||
jdq3.mesh.position.x = 19;
|
||||
jdq3.mesh.position.z = 65;
|
||||
jdq3.mesh.position.y = 1270;
|
||||
jdq3.mesh.rotation.y = -Math.PI/2;
|
||||
jdq3.mesh.rotation.z = -Math.PI/2;
|
||||
|
||||
jdq4.mesh.position.x = 19;
|
||||
jdq4.mesh.position.z = 170;
|
||||
jdq4.mesh.position.y = 1270;
|
||||
jdq4.mesh.rotation.y = -Math.PI/2;
|
||||
jdq4.mesh.rotation.z = -Math.PI/2;
|
||||
|
||||
scope.controllist.push(jdq1.mesh);
|
||||
scope.controllist.push(jdq2.mesh);
|
||||
scope.controllist.push(jdq3.mesh);
|
||||
scope.controllist.push(jdq4.mesh);
|
||||
scene.add(jdq1.mesh);
|
||||
scene.add(jdq2.mesh);
|
||||
scene.add(jdq3.mesh);
|
||||
scene.add(jdq4.mesh);
|
||||
scene.add(scope.jdqg.mesh);
|
||||
resolve("success"); //['成功了', 'success']
|
||||
}).catch((error) => {
|
||||
//console.log(error);
|
||||
@ -32,27 +97,37 @@ export function ModelManager(){
|
||||
function fbxpromise(asset,mixers,model){
|
||||
return new Promise(function(resolve, reject){
|
||||
var loader = new THREE.FBXLoader();
|
||||
|
||||
loader.load( asset.assetUrl, function ( object ) {
|
||||
let mixer = new THREE.AnimationMixer( object );
|
||||
object.traverse( function ( child ) {
|
||||
if ( child.isMesh ) {
|
||||
child.castShadow = true;
|
||||
child.receiveShadow = true;
|
||||
}
|
||||
} );
|
||||
// object.traverse( function ( child ) {
|
||||
// if ( child.isMesh ) {
|
||||
// child.castShadow = true;
|
||||
// child.receiveShadow = true;
|
||||
// }
|
||||
// } );
|
||||
|
||||
for(let i=0,leni=object.children.length;i<leni;i++){
|
||||
if(object.children[i].name == "fanghuozhao"){
|
||||
for(let j=0,lenj=object.children[i].children.length;j<lenj;j++){
|
||||
object.children[i].children[j].raycastoff = true;
|
||||
if(object.children[i].children[j].name == "waizhao"){
|
||||
object.children[i].children[j].material.depthTest = false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
model.mesh = object;
|
||||
if(object.animations.length>0){
|
||||
|
||||
model.action = mixer.clipAction( object.animations[ 0 ] );
|
||||
model.action.setLoop(THREE.LoopOnce);
|
||||
model.action.clampWhenFinished = true;
|
||||
|
||||
mixers.push(mixer);
|
||||
//model.action.play();
|
||||
}
|
||||
|
||||
|
||||
|
||||
resolve(asset.deviceType);
|
||||
} );
|
||||
|
||||
|
||||
@ -588,7 +588,7 @@ THREE.FBXLoader = ( function () {
|
||||
case 'DiffuseColor':
|
||||
case 'Maya|TEX_color_map':
|
||||
parameters.map = self.getTexture( textureMap, child.ID );
|
||||
parameters.map.encoding = THREE.sRGBEncoding;
|
||||
// parameters.map.encoding = THREE.sRGBEncoding;
|
||||
break;
|
||||
|
||||
case 'DisplacementColor':
|
||||
|
||||
@ -3,11 +3,11 @@ export function getBaseUrl() {
|
||||
let BASE_API;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// BASE_API = 'https://joylink.club/jlcloud';
|
||||
// BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
||||
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.3.41:9000'; // 张赛
|
||||
BASE_API = 'http://192.168.3.82:9000'; // 杜康
|
||||
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
|
||||
} else {
|
||||
BASE_API = process.env.VUE_APP_BASE_API;
|
||||
}
|
||||
|
||||
151
src/views/jlmap3d/devicetrain/component/devicetrainmenu.vue
Normal file
151
src/views/jlmap3d/devicetrain/component/devicetrainmenu.vue
Normal file
@ -0,0 +1,151 @@
|
||||
<template>
|
||||
<div class="editassets">
|
||||
<div class="asset-list">
|
||||
<el-tabs style="margin:5px" v-model="activeName">
|
||||
|
||||
<el-tab-pane class="displayscrol" label="设备部件" name="train">
|
||||
<el-scrollbar ref="devicescrol" style="height:100%;margin-bottom:1px">
|
||||
<el-form ref="form" label-width="120px" size="mini">
|
||||
<div class="displaylist" v-for="(part,index) in devicelist" @click="deviceselect(index,part)" v-show="true" >
|
||||
<div>
|
||||
<p >设备名称:{{part.text}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
</el-tab-pane>
|
||||
|
||||
|
||||
|
||||
</el-tabs>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
export default {
|
||||
name: 'Jl3ddevicetrainMenu',
|
||||
components: {
|
||||
|
||||
},
|
||||
props: ['devicelist'],
|
||||
data() {
|
||||
return {
|
||||
activeName: 'train',
|
||||
filterText: '',
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
devicetype:true,
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
||||
},
|
||||
watch: {
|
||||
filterText(val) {
|
||||
this.$refs.tree2.filter(val);
|
||||
},
|
||||
|
||||
'devicelist.length':function(newVal){
|
||||
console.log(newVal);
|
||||
this.$refs.devicescrol.update()
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
deviceselect(index,train){
|
||||
console.log(index);
|
||||
console.log(train);
|
||||
this.$emit('sdevice',train);
|
||||
},
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
},
|
||||
init: function() {
|
||||
|
||||
},
|
||||
back() {
|
||||
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
.editassets {
|
||||
position: absolute;
|
||||
float:right;
|
||||
right:0;
|
||||
top:0;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
// background-image:url("/static/texture/menu.png");
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: 100%;
|
||||
// border-radius:5px;
|
||||
}
|
||||
.asset-list{
|
||||
position:absolute;
|
||||
left:0;
|
||||
width: 90%;
|
||||
height: 100%;
|
||||
left: 5px;
|
||||
top: 15px;
|
||||
|
||||
|
||||
}
|
||||
.default-scrollbar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.el-scrollbar__wrap.default-scrollbar__wrap {
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.el-scrollbar__view.default-scrollbar__view {}
|
||||
.displayscrol{
|
||||
|
||||
height: 100%;
|
||||
}
|
||||
.displaylist {
|
||||
float:left;
|
||||
position: relative;
|
||||
width:80%;
|
||||
height:20px;
|
||||
margin:0px 0px 20px 0px;
|
||||
border-top:1px solid #000;
|
||||
}
|
||||
.modelpic{
|
||||
left:0;
|
||||
position: absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.modeltop{
|
||||
bottom:0;
|
||||
z-index:0;
|
||||
}
|
||||
.modeldown{
|
||||
top:0;
|
||||
z-index:0;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,21 +1,43 @@
|
||||
<template>
|
||||
<div class="jl3ddevice">
|
||||
<div id="jl3d" class="jl3ddraw">
|
||||
|
||||
</div>
|
||||
<Jl3ddevicetrain-Menu :devicelist="devicelist" @sdevice="sdevice" >
|
||||
</Jl3ddevicetrain-Menu>
|
||||
<div class="menutop">
|
||||
<el-button-group>
|
||||
<el-button type="primary" @click="selectdevice">选择设备</el-button>
|
||||
<el-button type="primary" @click="dispersed">{{devicestats}}</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<div class="menudown">
|
||||
<el-button-group>
|
||||
<el-button type="primary" @click="back">退出</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<div id="testjlmap3d" class="jlmap3ddraw">
|
||||
<canvas id="canvastexture" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import Vue from 'vue';
|
||||
import { Jl3ddevice } from '@/jlmap3d/jl3ddevicetrain/jl3ddevicetrain.js';
|
||||
|
||||
|
||||
import Jl3ddevicetrainMenu from '@/views/jlmap3d/devicetrain/component/devicetrainmenu';
|
||||
export default {
|
||||
name: 'devicetrain',
|
||||
components: {
|
||||
|
||||
Jl3ddevicetrainMenu
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
jl3d: null,
|
||||
devicelist:[],
|
||||
devicestats:"设备分解",
|
||||
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -38,9 +60,19 @@
|
||||
//
|
||||
// }
|
||||
// },
|
||||
// '$store.state.socket.simulationOverCount': function () {
|
||||
// this.unsubscribe();
|
||||
// }
|
||||
'jl3d.animastats': {
|
||||
handler: function (newVal, oldVal) {
|
||||
if (newVal != oldVal) {
|
||||
if(newVal == false){
|
||||
this.devicestats = "设备分解";
|
||||
}
|
||||
if(newVal == true){
|
||||
this.devicestats = "设备归位";
|
||||
}
|
||||
console.log(newVal);
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
code() {
|
||||
@ -48,22 +80,34 @@
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
let code = this.$route.query.code;
|
||||
let group = this.$route.query.group;
|
||||
let header = this.$route.query.token;
|
||||
// if (group) {
|
||||
// this.init(group,header);
|
||||
// // this.subscribe(code,group,header);
|
||||
// }
|
||||
this.init(group,header);
|
||||
window.updatemenulist = this.updatemenulist;
|
||||
this.init();
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
methods: {
|
||||
init: function (group,header) {
|
||||
init: function () {
|
||||
// let mapdata = this.$store.state.socket.device;
|
||||
let dom = document.getElementById('jl3d');
|
||||
this.jl3d = new Jl3ddevice(dom,group,header);
|
||||
this.jl3d = new Jl3ddevice(dom);
|
||||
},
|
||||
sdevice(changedata) {
|
||||
|
||||
this.jl3d.updateselect(changedata);
|
||||
|
||||
},
|
||||
selectdevice(device) {
|
||||
this.jl3d.backselect();
|
||||
},
|
||||
dispersed(device) {
|
||||
this.jl3d.disperdevice();
|
||||
},
|
||||
updatemenulist(devicelist) {
|
||||
console.log(devicelist);
|
||||
this.devicelist = devicelist;
|
||||
},
|
||||
back(changedata) {
|
||||
window.close();
|
||||
},
|
||||
}
|
||||
}
|
||||
@ -76,12 +120,12 @@
|
||||
|
||||
.jl3ddraw {
|
||||
position: absolute;
|
||||
float: right;
|
||||
float: left;
|
||||
top:0;
|
||||
/* left: 0; */
|
||||
width: 100%;
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
z-index: 1500;
|
||||
/* z-index: 1500; */
|
||||
}
|
||||
|
||||
#canvastexture {
|
||||
@ -90,4 +134,32 @@
|
||||
left: 0;
|
||||
z-index: -12;
|
||||
}
|
||||
|
||||
#testjlmap3d {
|
||||
}
|
||||
|
||||
.jlmap3ddraw {
|
||||
float: left;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position:absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
.menutop{
|
||||
top:0;
|
||||
right:20%;
|
||||
position:absolute;
|
||||
}
|
||||
.menudown{
|
||||
bottom:0;
|
||||
right:20%;
|
||||
position:absolute;
|
||||
}
|
||||
#canvastexture {
|
||||
position: absolute;
|
||||
float: left;
|
||||
left: 0;
|
||||
z-index: -12;
|
||||
}
|
||||
</style>
|
||||
|
||||
Binary file not shown.
BIN
static/model/jdq/jdq1000.FBX
Normal file
BIN
static/model/jdq/jdq1000.FBX
Normal file
Binary file not shown.
BIN
static/model/jdq/jdq1000111.FBX
Normal file
BIN
static/model/jdq/jdq1000111.FBX
Normal file
Binary file not shown.
BIN
static/model/jdq/jdq1700.FBX
Normal file
BIN
static/model/jdq/jdq1700.FBX
Normal file
Binary file not shown.
BIN
static/model/jdq/jdq480.FBX
Normal file
BIN
static/model/jdq/jdq480.FBX
Normal file
Binary file not shown.
BIN
static/model/jdq/jdqg.FBX
Normal file
BIN
static/model/jdq/jdqg.FBX
Normal file
Binary file not shown.
BIN
static/model/jdq/jdqh18.FBX
Normal file
BIN
static/model/jdq/jdqh18.FBX
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user