三维车站客流管理模块代码修改
This commit is contained in:
sunzhenyu
parent
f3e95ffccb
commit
6c1fef1bea
438
src/jlmap3d/jl3dstationmanager/component/jl3dactionmanager.js
Normal file
438
src/jlmap3d/jl3dstationmanager/component/jl3dactionmanager.js
Normal file
@ -0,0 +1,438 @@
|
||||
import { Staticmodel } from '@/jlmap3d/jl3dtrafficplan/loader/stationconfig.js';
|
||||
//静态资源文件路劲
|
||||
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
|
||||
//loader
|
||||
import { FBXLoader } from '@/jlmap3d/main/loaders/FBXLoader';
|
||||
//轨道视角控制
|
||||
import { StationManagerControls } from '@/jlmap3d/jl3dstationmanager/controls/stationManagerControls';
|
||||
//模型管理器
|
||||
import { ModelManager } from '@/jlmap3d/jl3dstationmanager/loader/loader.js';
|
||||
//骨骼动画模型辅助工具
|
||||
import { SkeletonUtils } from '@/jlmap3d/main/utils/SkeletonUtils.js';
|
||||
//获取信息接口
|
||||
import { getPublishMapVersion, getPublishMapDetail,getPublish3dMapDetail} from '@/api/jlmap3d/load3ddata';
|
||||
//cctv站台对象
|
||||
import { PasserStation } from '@/jlmap3d/jl3dtrafficplan/model/passerstation.js';
|
||||
//cctv检票机对象
|
||||
import { PasserCheckDoor } from '@/jlmap3d/jl3dtrafficplan/model/passercheckdoor.js';
|
||||
//cctv列车对象
|
||||
import { PasserTrain } from '@/jlmap3d/jl3dtrafficplan/model/passertrain.js';
|
||||
//cctv行人对象
|
||||
import { PasserHuman } from '@/jlmap3d/jl3dtrafficplan/model/passerhuman.js';
|
||||
//cctv渲染器
|
||||
import { PasserRender } from '@/jlmap3d/jl3dpassflow/passerrender/passerrender.js';
|
||||
//cctv行人ai
|
||||
import { PasserAi } from '@/jlmap3d/jl3dtrafficplan/passerai/passerai.js';
|
||||
//行人寻路相关工具
|
||||
import { ZoneManager } from '@/jlmap3d/jl3dtrafficplan/model/zonemanager.js';
|
||||
import { PathFinder } from '@/jlmap3d/jl3dtrafficplan/passerai/pathfinder.js';
|
||||
//cctv通信工具
|
||||
import { PassflowConnect } from '@/jlmap3d/jl3dtrafficplan/connect/stationconnect.js';
|
||||
|
||||
import StompClient from '@/utils/sock';
|
||||
import store from '@/store/index';
|
||||
// import { Loading } from 'element-ui';
|
||||
import {Stats} from '@/jlmap3d/main/lib/stats.min.js';
|
||||
|
||||
//动画播放相关
|
||||
let clock = new THREE.Clock();
|
||||
let delta;
|
||||
|
||||
let scene,camerass,renderer;
|
||||
|
||||
let aiswitch = 0;
|
||||
//动画组
|
||||
let mixers = [];
|
||||
//车站摄像机模型
|
||||
let monitor;
|
||||
|
||||
//寻路相关对象
|
||||
let passerZone = new ZoneManager();
|
||||
let pathFinder = new PathFinder();
|
||||
let path;
|
||||
|
||||
//设备动画action组
|
||||
let deviceaction = [];
|
||||
//控制帧率的webworker线程
|
||||
let passerWebWork = new Worker(JL3D_LOCAL_STATIC+"/workertest/trafficplan/trafficstation.js");
|
||||
|
||||
//老版本临时ai控制
|
||||
let olddataai = false;
|
||||
|
||||
export function Jl3dStationManager(dom,skinCode,routegroup,viewMap,initCode) {
|
||||
|
||||
// let stats = new Stats();
|
||||
// dom.appendChild( stats.dom );
|
||||
|
||||
let scope = this;
|
||||
|
||||
this.dom = dom;
|
||||
this.nowcode = null;
|
||||
this.animateswitch = false;
|
||||
this.signallights = [];
|
||||
this.mixers = [];
|
||||
this.showmodel = null;
|
||||
|
||||
this.allStationData = [];
|
||||
this.humanWaitTop = 0;
|
||||
this.humanWaitDown = 0;
|
||||
this.humanInSpeed = 0;
|
||||
this.humanOutSpeed = 0;
|
||||
let waitForCreatIn = [];
|
||||
let waitForCreatOutTop = [];
|
||||
let waitForCreatOutDown = [];
|
||||
//定义相机
|
||||
camerass = new THREE.PerspectiveCamera(70, dom.offsetWidth / dom.offsetHeight, 0.01, 10000);
|
||||
camerass.position.set(0,200,0);
|
||||
camerass.aspect = dom.offsetWidth / dom.offsetHeight;
|
||||
camerass.updateProjectionMatrix();
|
||||
|
||||
//定义场景(渲染容器)
|
||||
scene = new THREE.Scene();
|
||||
// scene.background = new THREE.Color(0xa0a0a0);
|
||||
|
||||
|
||||
var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
mesh.rotation.x = - Math.PI / 2;
|
||||
mesh.receiveShadow = true;
|
||||
scene.add( mesh );
|
||||
|
||||
var grid = new THREE.GridHelper( 1000, 100, 0x000000, 0x000000 );
|
||||
grid.material.opacity = 0.2;
|
||||
grid.material.transparent = true;
|
||||
scene.add( grid );
|
||||
|
||||
let passerRender = new PasserRender(viewMap);
|
||||
passerRender.initView(dom,scene,camerass);
|
||||
passerRender.reSize(scope.dom.offsetWidth,scope.dom.offsetHeight);
|
||||
//定义全局光
|
||||
let ambientLight = new THREE.AmbientLight(0xffffff, 1.3);
|
||||
scene.add(ambientLight);
|
||||
var light = new THREE.HemisphereLight( 0xffffff, 0x444444 );
|
||||
light.position.set( 0, 4000, 0 );
|
||||
scene.add( light );
|
||||
|
||||
let controls = new THREE.StationManagerControls(camerass, dom,camerass,scene,mesh);
|
||||
// controls.maxPolarAngle = Math.PI / 2;
|
||||
// controls.minPolarangle = Math.PI / 5;
|
||||
// controls.maxDistance = 800;
|
||||
controls.screenSpacePanning = true;
|
||||
|
||||
controls.target.set( 1, 0, 0 );
|
||||
controls.controlMode = "Draw";
|
||||
controls.update();
|
||||
this.selectmodel = null;
|
||||
|
||||
// let mouse = new THREE.Vector2();
|
||||
let raycaster = new THREE.Raycaster();
|
||||
|
||||
//进站运动中乘客
|
||||
let humanlist = new THREE.Group();
|
||||
//上行等待上车乘客
|
||||
let topWaitPassers = new THREE.Group();
|
||||
//下行等待上车乘客
|
||||
let downWaitPassers = new THREE.Group();
|
||||
//出站乘客
|
||||
let outStationPassers = new THREE.Group();
|
||||
|
||||
let passerHuman = new PasserHuman();
|
||||
|
||||
let passerAi = new PasserAi(passerZone,pathFinder);
|
||||
|
||||
this.anime = null;
|
||||
|
||||
this.modelmanager = new ModelManager();
|
||||
// let loadingInstance = Loading.service({ fullscreen: true });
|
||||
|
||||
let stationlist = [];
|
||||
let socktest = null;
|
||||
let passerStation = new PasserStation();
|
||||
let passerCheckDoor = new PasserCheckDoor();
|
||||
let passerTrain = new PasserTrain();
|
||||
|
||||
// document.addEventListener( "mousedown", onselect, false );
|
||||
|
||||
this.modelmanager.loadpromise(Staticmodel, scope.mixers,"2").then(function (data) {
|
||||
// console.log(scope.modelmanager.station.mesh.getObjectByName("top"));
|
||||
// let testtop = scope.modelmanager.station.mesh.getObjectByName("down");
|
||||
// for(let i=0;i<testtop.children.length;i++){
|
||||
// console.log(testtop.children[i].matrixWorld.elements[12]);
|
||||
// console.log(testtop.children[i].matrixWorld.elements);
|
||||
// }
|
||||
// console.log(scope.modelmanager.station.mesh.getObjectByName("down"));
|
||||
passerStation.initStationAnimation(scope.modelmanager.station.mesh,mixers,deviceaction,scene);
|
||||
passerCheckDoor.initCheckDoorInAnimation(scope.modelmanager.zhajiin.mesh,mixers,deviceaction,scene);
|
||||
passerCheckDoor.initCheckDoorOutAnimation(scope.modelmanager.zhajiout.mesh,mixers,deviceaction,scene);
|
||||
|
||||
passerTrain.initTrain(scope.modelmanager.train.mesh,mixers,deviceaction,scene);
|
||||
|
||||
scene.add(scope.modelmanager.section.mesh);
|
||||
|
||||
monitor = scope.modelmanager.monitor.mesh;
|
||||
scene.add(monitor);
|
||||
console.log("animate");
|
||||
animate();
|
||||
})
|
||||
|
||||
this.initTrafficStart = function(){
|
||||
passerStation.initCodeStation(initCode);
|
||||
scope.humanWaitTop = passerStation.nowStation.toppassers;
|
||||
scope.humanWaitDown = passerStation.nowStation.downpassers;
|
||||
scope.humanInSpeed = 0;
|
||||
scope.humanOutSpeed = 0;
|
||||
passerHuman.speed = scope.humanInSpeed;
|
||||
passerAi.initPasser(humanlist,topWaitPassers,downWaitPassers,passerHuman,scope);
|
||||
|
||||
updatePasserData(humanlist.children.length,topWaitPassers.children.length,downWaitPassers.children.length,outStationPassers.children.length,passerHuman.speed);
|
||||
scope.resetscene();
|
||||
}
|
||||
|
||||
this.changestation = function(stationname){
|
||||
passerStation.changestation(stationname);
|
||||
// console.log(passerStation.nowStation);
|
||||
scope.humanWaitTop = passerStation.nowStation.toppassers;
|
||||
scope.humanWaitDown = passerStation.nowStation.downpassers;
|
||||
passerHuman.speed = passerStation.nowStation.topspeed + passerStation.nowStation.downspeed;
|
||||
updatePasserData(humanlist.children.length,topWaitPassers.children.length,downWaitPassers.children.length,outStationPassers.children.length,passerHuman.speed);
|
||||
|
||||
scope.resetscene();
|
||||
}
|
||||
|
||||
this.updateNowStationData = function(){
|
||||
for(let i=0;i<passerStation.nowStation.topspeed;i++){
|
||||
let newIn = {
|
||||
overGoal:"top",
|
||||
};
|
||||
waitForCreatIn.push(newIn);
|
||||
}
|
||||
for(let i=0;i<passerStation.nowStation.downspeed;i++){
|
||||
let newIn = {
|
||||
overGoal:"down",
|
||||
};
|
||||
waitForCreatIn.push(newIn);
|
||||
}
|
||||
|
||||
|
||||
scope.humanInSpeed = passerStation.nowStation.topspeed+passerStation.nowStation.downspeed;
|
||||
passerHuman.speed = scope.humanInSpeed;
|
||||
passerWebWork.postMessage(["changespeed",scope.humanInSpeed/30]);
|
||||
}
|
||||
|
||||
this.updateNowLeaveData = function(direct,outNum){
|
||||
if(direct == "top"){
|
||||
waitForCreatOutTop = getnum(outNum,17);
|
||||
// console.log(waitForCreatOutTop);
|
||||
for(let i=0;i<waitForCreatOutTop.length;i++){
|
||||
for(let j=0;j<waitForCreatOutTop[i];j++){
|
||||
setTimeout(function(){
|
||||
// console.log(passerZone.list["standtop"].doorpoints[i]);
|
||||
passerHuman.newHumanCreate(outStationPassers,passerZone.list["standtop"].doorpoints[i],5,"top",i);
|
||||
}, Math.random()*1000*j);
|
||||
}
|
||||
}
|
||||
}else{
|
||||
waitForCreatOutDown = getnum(outNum,17);
|
||||
for(let i=0;i<waitForCreatOutDown.length;i++){
|
||||
for(let j=0;j<waitForCreatOutDown[i];j++){
|
||||
setTimeout(function(){
|
||||
// console.log(passerZone.list["standdown"].doorpoints[i]);
|
||||
passerHuman.newHumanCreate(outStationPassers,passerZone.list["standdown"].doorpoints[i],5,"down",i);
|
||||
}, Math.random()*1000*j);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.resetscene = function(){
|
||||
aiswitch = 1;
|
||||
passerAi.toppasserin = false;
|
||||
passerAi.downpasserin = false;
|
||||
//下车控制开关
|
||||
passerAi.toppasseron = false;
|
||||
passerAi.downpasseron = false;
|
||||
passerAi.toppasserinNum = 0;
|
||||
passerAi.downpasserinNum = 0;
|
||||
|
||||
passerTrain.toptrain.nowcode = null;
|
||||
passerTrain.downtrain.nowcode = null;
|
||||
// humanlist = new THREE.Group();
|
||||
for(let j=0; j<humanlist.children.length;j++){
|
||||
|
||||
humanlist.remove(humanlist.children[j]);
|
||||
j--;
|
||||
// j--;
|
||||
}
|
||||
|
||||
for(let j=0; j<topWaitPassers.children.length;j++){
|
||||
|
||||
topWaitPassers.remove(topWaitPassers.children[j]);
|
||||
j--;
|
||||
// j--;
|
||||
}
|
||||
for(let j=0; j<downWaitPassers.children.length;j++){
|
||||
|
||||
downWaitPassers.remove(downWaitPassers.children[j]);
|
||||
j--;
|
||||
// j--;
|
||||
}
|
||||
for(let j=0; j<outStationPassers.children.length;j++){
|
||||
|
||||
outStationPassers.remove(outStationPassers.children[j]);
|
||||
j--;
|
||||
// j--;
|
||||
}
|
||||
|
||||
|
||||
|
||||
passerTrain.toptrain.position.y = -20000;
|
||||
passerTrain.downtrain.position.y = -20000;
|
||||
|
||||
deviceaction.down.action.reset();
|
||||
deviceaction.down.action.time = deviceaction.down.action._clip.duration;
|
||||
deviceaction.down.action.timeScale = -1;
|
||||
deviceaction.down.action.play();
|
||||
|
||||
deviceaction.top.action.reset();
|
||||
deviceaction.top.action.time = deviceaction.down.action._clip.duration;
|
||||
deviceaction.top.action.timeScale = -1;
|
||||
deviceaction.top.action.play();
|
||||
for(let an=passerTrain.toptrain.action.top.length-1;an>=0;an--){
|
||||
passerTrain.toptrain.action.top[an].reset();
|
||||
passerTrain.toptrain.action.top[an].time = passerTrain.toptrain.action.top[an]._clip.duration;
|
||||
passerTrain.toptrain.action.top[an].timeScale = -1;
|
||||
passerTrain.toptrain.action.top[an].play();
|
||||
}
|
||||
for(let an=passerTrain.toptrain.action.down.length-1;an>=0;an--){
|
||||
passerTrain.toptrain.action.down[an].reset();
|
||||
passerTrain.toptrain.action.down[an].time = passerTrain.toptrain.action.down[an]._clip.duration;
|
||||
passerTrain.toptrain.action.down[an].timeScale = -1;
|
||||
passerTrain.toptrain.action.down[an].play();
|
||||
}
|
||||
// for(let an=actions.length-1;an>=0;an--){
|
||||
// actions[an].reset();
|
||||
// actions[an].time = actions[an]._clip.duration;
|
||||
// actions[an].timeScale = -1;
|
||||
// actions[an].play();
|
||||
// }
|
||||
setTimeout(function(){
|
||||
passerAi.initPasser(humanlist,topWaitPassers,downWaitPassers,passerHuman,scope);
|
||||
aiswitch = 0;
|
||||
}, 2000);
|
||||
|
||||
}
|
||||
|
||||
function startWorker(){
|
||||
|
||||
let updateaianimate = setInterval(
|
||||
function(){
|
||||
// console.log("?");
|
||||
if(aiswitch == 0){
|
||||
updatePasserData(humanlist.children.length,topWaitPassers.children.length,downWaitPassers.children.length,outStationPassers.children.length,passerHuman.speed);
|
||||
|
||||
passerHuman.moveAnimateUpdate(humanlist,topWaitPassers,downWaitPassers,outStationPassers,passerHuman);
|
||||
passerAi.aiUpdate(humanlist,topWaitPassers,downWaitPassers,outStationPassers,passerHuman,passerCheckDoor,deviceaction);
|
||||
// passerZone.zoneActionCheck(humanlist,passerHuman,passerCheckDoor,deviceaction);
|
||||
delta = clock.getDelta();
|
||||
|
||||
for(let i=mixers.length-1;i>=0;i--){
|
||||
if(mixers[i]._actions[0].isRunning()){
|
||||
mixers[i].update( delta );
|
||||
}
|
||||
}
|
||||
// for(let i=topWaitPassers.children.length-1;i>=0;i--){
|
||||
// if(topWaitPassers.children[i].mixer._actions[0].isRunning()){
|
||||
// topWaitPassers.children[i].mixer.update( delta );
|
||||
// }
|
||||
// }
|
||||
// for(let i=downWaitPassers.children.length-1;i>=0;i--){
|
||||
// if(downWaitPassers.children[i].mixer._actions[0].isRunning()){
|
||||
// downWaitPassers.children[i].mixer.update( delta );
|
||||
// }
|
||||
// }
|
||||
// for(let i=outStationPassers.children.length-1;i>=0;i--){
|
||||
// if(outStationPassers.children[i].mixer._actions[0].isRunning()){
|
||||
// outStationPassers.children[i].mixer.update( delta );
|
||||
// }
|
||||
// }
|
||||
// for(let i=humanlist.children.length-1;i>=0;i--){
|
||||
// if(humanlist.children[i].mixer._actions[0].isRunning()){
|
||||
// humanlist.children[i].mixer.update( delta );
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
, 100);
|
||||
|
||||
passerWebWork.onmessage = function (event) {
|
||||
if(aiswitch == 0){
|
||||
// console.log(humanlist.children.length);
|
||||
|
||||
this.allStationData = [];
|
||||
if(waitForCreatIn.length>0){
|
||||
let direct = Math.floor(Math.random()*(3-1+1))+1;
|
||||
//1--top
|
||||
//2-- down
|
||||
if(direct == 1){
|
||||
passerHuman.newHumanCreate(humanlist,passerZone.getzoneposition("enter1"),0,waitForCreatIn[0].overGoal);
|
||||
}else{
|
||||
passerHuman.newHumanCreate(humanlist,passerZone.getzoneposition("enter2"),0,waitForCreatIn[0].overGoal);
|
||||
}
|
||||
waitForCreatIn.shift();
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
//
|
||||
// function onselect(event){
|
||||
// if(event.button == '0'){
|
||||
//
|
||||
// //定义光线
|
||||
// let raycaster = new THREE.Raycaster();
|
||||
// //定义平面鼠标点击坐标
|
||||
// let mouse = new THREE.Vector2();
|
||||
// mouse.x = (event.clientX / scope.dom.offsetWidth) * 2 - 1;
|
||||
// mouse.y = -(event.clientY / scope.dom.offsetHeight) * 2 + 1;
|
||||
//
|
||||
// raycaster.setFromCamera( mouse, camerass );
|
||||
//
|
||||
// let intersects = raycaster.intersectObject(scope.modelmanager.station.mesh,true);
|
||||
// console.log(intersects[0].point);
|
||||
// }
|
||||
// }
|
||||
|
||||
|
||||
//循环渲染函数
|
||||
function animate() {
|
||||
passerRender.update();
|
||||
// console.log(passerRender);
|
||||
// console.log("ss");
|
||||
// if(passerRender.state == "freeview"){
|
||||
controls.update();
|
||||
// }
|
||||
// delta = clock.getDelta();
|
||||
|
||||
requestAnimationFrame(animate);
|
||||
|
||||
}
|
||||
|
||||
window.onresize = function () {
|
||||
passerRender.reSize(scope.dom.offsetWidth,scope.dom.offsetHeight);
|
||||
}
|
||||
|
||||
this.switchviews = function(viewmode){
|
||||
passerRender.changeRenderMode(viewmode);
|
||||
}
|
||||
|
||||
|
||||
function getnum(num,pnum){
|
||||
let re = [];
|
||||
let base = Math.floor(num/pnum);
|
||||
let reset = num%pnum;
|
||||
for(let i=0;i<pnum;i++){
|
||||
let nownum = base+(i<reset?1:0);
|
||||
re.push(nownum);
|
||||
}
|
||||
return re;
|
||||
}
|
||||
|
||||
}
|
||||
1518
src/jlmap3d/jl3dstationmanager/controls/TransformControls.js
Normal file
1518
src/jlmap3d/jl3dstationmanager/controls/TransformControls.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -13,20 +13,33 @@
|
||||
// Zoom - middle mouse, or mousewheel / touch: two-finger spread or squish
|
||||
// Pan - right mouse, or left mouse + ctrl/meta/shiftKey, or arrow keys / touch: two-finger move
|
||||
|
||||
THREE.StationManagerControls = function ( object, domElement ) {
|
||||
THREE.StationManagerControls = function ( object, domElement ,camera,scene) {
|
||||
this.object = object;
|
||||
|
||||
this.planeMesh = [];
|
||||
this.data = {
|
||||
stationstandlist : null,
|
||||
trainlisttest : null
|
||||
};
|
||||
|
||||
|
||||
|
||||
this.animateswitch = null;
|
||||
this.scene = null;
|
||||
|
||||
//控制模式切换
|
||||
//画线:Orbit 绘图:Draw
|
||||
this.controlMode = "Orbit";
|
||||
this.drawColor = 0x2894FF;
|
||||
this.drawSwitch = false;
|
||||
this.drawGroup = new THREE.Group();
|
||||
scene.add(this.drawGroup);
|
||||
|
||||
let drawMesh = null;
|
||||
let mouse = new THREE.Vector2();
|
||||
let raycaster = new THREE.Raycaster();
|
||||
let intersects = null;
|
||||
let drawStartPoint = null;
|
||||
let drawEndPoint = null;
|
||||
|
||||
this.domElement = ( domElement !== undefined ) ? domElement : document;
|
||||
|
||||
@ -96,6 +109,10 @@ THREE.StationManagerControls = function ( object, domElement ) {
|
||||
//
|
||||
// public methods
|
||||
//
|
||||
this.initPlaneMesh = function (planeMesh){
|
||||
scope.planeMesh["1floor"] = planeMesh.topfloor;
|
||||
scope.planeMesh["2floor"] = planeMesh.downfloor;
|
||||
};
|
||||
|
||||
this.getPolarAngle = function () {
|
||||
|
||||
@ -729,7 +746,7 @@ THREE.StationManagerControls = function ( object, domElement ) {
|
||||
// prevents the browser from setting it automatically.
|
||||
|
||||
scope.domElement.focus ? scope.domElement.focus() : window.focus();
|
||||
if(scope.controlMode == "orbit"){
|
||||
if(scope.controlMode == "Orbit"){
|
||||
switch ( event.button ) {
|
||||
|
||||
case scope.mouseButtons.RIGHT:
|
||||
@ -779,11 +796,29 @@ THREE.StationManagerControls = function ( object, domElement ) {
|
||||
}
|
||||
|
||||
if(scope.controlMode == "Draw"){
|
||||
var geometry = new THREE.PlaneGeometry( 20, 20, 1 );
|
||||
var material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
|
||||
var plane = new THREE.Mesh( geometry, material );
|
||||
scene.add( plane );
|
||||
plane.position.x = 200;
|
||||
if(scope.drawSwitch == true){
|
||||
var geometry = new THREE.PlaneGeometry( 1, 1, 1 );
|
||||
var material = new THREE.MeshBasicMaterial( {color: scope.drawColor, side: THREE.DoubleSide} );
|
||||
drawMesh = new THREE.Mesh( geometry, material );
|
||||
drawMesh.renderOrder = 8;
|
||||
// drawMesh.rotation.x = Math.PI/2;
|
||||
scope.drawGroup.add( drawMesh );
|
||||
// let edges = new THREE.EdgesHelper( drawMesh, 0x0000C6 );//设置边框，可以旋转
|
||||
|
||||
// drawMesh.add( edges );
|
||||
|
||||
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||||
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||||
raycaster.setFromCamera( mouse, camera );
|
||||
for(let k in scope.planeMesh){
|
||||
intersects = raycaster.intersectObject( scope.planeMesh[k] );
|
||||
if(intersects[0]){
|
||||
drawMesh.underFloor = k;
|
||||
drawStartPoint = intersects[0].point;
|
||||
state = "Draw";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ( state !== STATE.NONE ) {
|
||||
@ -833,15 +868,39 @@ THREE.StationManagerControls = function ( object, domElement ) {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if(scope.controlMode == "Draw"){
|
||||
let points = [
|
||||
{x:-10,y:0,z:10},
|
||||
{x:10,y:0,z:10},
|
||||
{x:-10,y:0,z:-10},
|
||||
{x:10,y:0,z:-10}
|
||||
];
|
||||
plane.geometry.setFromPoints(points);
|
||||
|
||||
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||||
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||||
raycaster.setFromCamera( mouse, camera );
|
||||
for(let k in scope.planeMesh){
|
||||
intersects = raycaster.intersectObject( scope.planeMesh[k] );
|
||||
if(intersects[0]){
|
||||
drawEndPoint = intersects[0].point;
|
||||
let points = [
|
||||
|
||||
new THREE.Vector3(drawStartPoint.x,drawStartPoint.y+0.1,drawStartPoint.z),
|
||||
new THREE.Vector3(drawEndPoint.x,drawStartPoint.y+0.1,drawStartPoint.z),
|
||||
new THREE.Vector3(drawStartPoint.x,drawStartPoint.y+0.1,drawEndPoint.z),
|
||||
new THREE.Vector3(drawEndPoint.x,drawStartPoint.y+0.1,drawEndPoint.z)
|
||||
];
|
||||
for(let i=0;i<drawMesh.geometry.vertices.length;i++){
|
||||
drawMesh.geometry.vertices[i].set(points[i].x,points[i].y,points[i].z);
|
||||
}
|
||||
// drawMesh.geometry.vertices = points;
|
||||
drawMesh.geometry.verticesNeedUpdate = true;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// let points = [
|
||||
// {x:-10,y:0,z:10},
|
||||
// {x:10,y:0,z:10},
|
||||
// {x:-10,y:0,z:-10},
|
||||
// {x:10,y:0,z:-10}
|
||||
// ];
|
||||
// plane.geometry.setFromPoints(points);
|
||||
}
|
||||
|
||||
}
|
||||
@ -854,7 +913,10 @@ THREE.StationManagerControls = function ( object, domElement ) {
|
||||
|
||||
}
|
||||
if(scope.controlMode == "Draw"){
|
||||
|
||||
scope.drawSwitch = false;
|
||||
drawMesh = null;
|
||||
drawStartPoint = null;
|
||||
drawEndPoint = null;
|
||||
}
|
||||
handleMouseUp( event );
|
||||
|
||||
|
||||
@ -1,26 +1,26 @@
|
||||
import { Staticmodel } from '@/jlmap3d/jl3dtrafficplan/loader/stationconfig.js';
|
||||
import { Staticmodel } from '@/jlmap3d/jl3dstationmanager/loader/stationconfig.js';
|
||||
//静态资源文件路劲
|
||||
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
|
||||
//loader
|
||||
import { FBXLoader } from '@/jlmap3d/main/loaders/FBXLoader';
|
||||
//轨道视角控制
|
||||
import { StationManagerControls } from '@/jlmap3d/jl3dstationmanager/controls/stationManagerControls';
|
||||
//区域控制
|
||||
import { TransformControls } from '@/jlmap3d/jl3dstationmanager/controls/TransformControls';
|
||||
//模型管理器
|
||||
import { ModelManager } from '@/jlmap3d/jl3dtrafficplan/loader/loader.js';
|
||||
import { ModelManager } from '@/jlmap3d/jl3dstationmanager/loader/loader.js';
|
||||
//骨骼动画模型辅助工具
|
||||
import { SkeletonUtils } from '@/jlmap3d/main/utils/SkeletonUtils.js';
|
||||
//获取信息接口
|
||||
import { getPublishMapVersion, getPublishMapDetail,getPublish3dMapDetail} from '@/api/jlmap3d/load3ddata';
|
||||
//cctv站台对象
|
||||
import { PasserStation } from '@/jlmap3d/jl3dtrafficplan/model/passerstation.js';
|
||||
import { PasserStation } from '@/jlmap3d/jl3dstationmanager/model/passerstation.js';
|
||||
//cctv检票机对象
|
||||
import { PasserCheckDoor } from '@/jlmap3d/jl3dtrafficplan/model/passercheckdoor.js';
|
||||
//cctv列车对象
|
||||
import { PasserTrain } from '@/jlmap3d/jl3dtrafficplan/model/passertrain.js';
|
||||
//cctv行人对象
|
||||
import { PasserHuman } from '@/jlmap3d/jl3dtrafficplan/model/passerhuman.js';
|
||||
//cctv渲染器
|
||||
import { PasserRender } from '@/jlmap3d/jl3dpassflow/passerrender/passerrender.js';
|
||||
//cctv行人ai
|
||||
import { PasserAi } from '@/jlmap3d/jl3dtrafficplan/passerai/passerai.js';
|
||||
//行人寻路相关工具
|
||||
@ -82,29 +82,35 @@ export function Jl3dStationManager(dom,skinCode,routegroup,viewMap,initCode) {
|
||||
let waitForCreatOutTop = [];
|
||||
let waitForCreatOutDown = [];
|
||||
//定义相机
|
||||
camerass = new THREE.PerspectiveCamera(70, dom.offsetWidth / dom.offsetHeight, 0.01, 10000);
|
||||
camerass.position.set(0, 100, 0);
|
||||
camerass = new THREE.PerspectiveCamera(70, dom.offsetWidth / dom.offsetHeight, 0.1, 10000);
|
||||
camerass.position.set(0,300,0);
|
||||
camerass.aspect = dom.offsetWidth / dom.offsetHeight;
|
||||
camerass.updateProjectionMatrix();
|
||||
|
||||
//定义场景(渲染容器)
|
||||
scene = new THREE.Scene();
|
||||
// scene.background = new THREE.Color(0xa0a0a0);
|
||||
scene.background = new THREE.Color(0xa0a0a0);
|
||||
|
||||
|
||||
var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
mesh.rotation.x = - Math.PI / 2;
|
||||
mesh.receiveShadow = true;
|
||||
scene.add( mesh );
|
||||
// var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
// mesh.rotation.x = - Math.PI / 2;
|
||||
// mesh.receiveShadow = true;
|
||||
// scene.add( mesh );
|
||||
|
||||
// var grid = new THREE.GridHelper( 1000, 100, 0x000000, 0x000000 );
|
||||
// grid.material.opacity = 0.2;
|
||||
// grid.material.transparent = true;
|
||||
// scene.add( grid );
|
||||
|
||||
|
||||
renderer = new THREE.WebGLRenderer({ antialias: true });
|
||||
renderer.setClearColor(new THREE.Color(0x000000));
|
||||
renderer.setSize(scope.dom.offsetWidth,scope.dom.offsetHeight);
|
||||
renderer.sortObjects = true;
|
||||
dom.appendChild(renderer.domElement);
|
||||
|
||||
var grid = new THREE.GridHelper( 1000, 100, 0x000000, 0x000000 );
|
||||
grid.material.opacity = 0.2;
|
||||
grid.material.transparent = true;
|
||||
scene.add( grid );
|
||||
|
||||
|
||||
let passerRender = new PasserRender(viewMap);
|
||||
passerRender.initView(dom,scene,camerass);
|
||||
|
||||
//定义全局光
|
||||
let ambientLight = new THREE.AmbientLight(0xffffff, 1.3);
|
||||
@ -113,14 +119,36 @@ export function Jl3dStationManager(dom,skinCode,routegroup,viewMap,initCode) {
|
||||
light.position.set( 0, 4000, 0 );
|
||||
scene.add( light );
|
||||
|
||||
let controls = new THREE.StationManagerControls(camerass, dom);
|
||||
controls.maxPolarAngle = Math.PI / 2;
|
||||
controls.minPolarangle = Math.PI / 5;
|
||||
controls.maxDistance = 800;
|
||||
let controls = new THREE.StationManagerControls(camerass, dom,camerass,scene);
|
||||
// controls.maxPolarAngle = Math.PI / 2;
|
||||
// controls.minPolarangle = Math.PI / 5;
|
||||
// controls.maxDistance = 800;
|
||||
controls.screenSpacePanning = true;
|
||||
|
||||
controls.target.set( 1, 0, 0 );
|
||||
controls.controlMode = "Orbit";
|
||||
controls.update();
|
||||
this.selectmodel = null;
|
||||
|
||||
var meshtest = new THREE.Mesh( new THREE.PlaneBufferGeometry( 200, 200 ), new THREE.MeshPhongMaterial( { color: 0x999999, depthWrite: false } ) );
|
||||
meshtest.rotation.x = - Math.PI / 2;
|
||||
meshtest.receiveShadow = true;
|
||||
scene.add( meshtest );
|
||||
|
||||
|
||||
let transformControl = new THREE.TransformControls( camerass, renderer.domElement );
|
||||
transformControl.addEventListener( 'change', render );
|
||||
|
||||
transformControl.addEventListener( 'dragging-changed', function ( event ) {
|
||||
|
||||
controls.enabled = ! event.value;
|
||||
|
||||
} );
|
||||
scene.add(transformControl);
|
||||
|
||||
|
||||
|
||||
|
||||
// let mouse = new THREE.Vector2();
|
||||
let raycaster = new THREE.Raycaster();
|
||||
|
||||
@ -398,26 +426,81 @@ export function Jl3dStationManager(dom,skinCode,routegroup,viewMap,initCode) {
|
||||
// }
|
||||
// }
|
||||
|
||||
this.changeDrawType = function(drawType){
|
||||
console.log(drawType);
|
||||
controls.drawSwitch = true;
|
||||
if(drawType == "stationRegion"){
|
||||
controls.drawColor = 0x2894FF;
|
||||
}
|
||||
if(drawType == "securityRegion"){
|
||||
controls.drawColor = 0xFF0000;
|
||||
}
|
||||
if(drawType == "checkRegion"){
|
||||
controls.drawColor = 0x9F35FF;
|
||||
}
|
||||
if(drawType == "standRegion"){
|
||||
controls.drawColor = 0x00EC00;
|
||||
}
|
||||
if(drawType == "ticketRegion"){
|
||||
controls.drawColor = 0x00FFFF;
|
||||
}
|
||||
if(drawType == "elevatorRegion"){
|
||||
controls.drawColor = 0xFFFF37;
|
||||
}
|
||||
if(drawType == "stairsRegion"){
|
||||
controls.drawColor = 0xFF5809;
|
||||
}
|
||||
if(drawType == "escalatorRegion"){
|
||||
controls.drawColor = 0x5CADAD;
|
||||
}
|
||||
if(drawType == "unaccessRegion"){
|
||||
controls.drawColor = 0x272727;
|
||||
}
|
||||
}
|
||||
|
||||
let oldCameraPosition = new THREE.Vector3();
|
||||
let oldCameraTarget = new THREE.Vector3();
|
||||
this.changeControlMode = function(controlMode){
|
||||
console.log(passerStation);
|
||||
transformControl.attach(passerStation.topfloor);
|
||||
if(controlMode == false){
|
||||
controls.controlMode = "Orbit";
|
||||
camerass.position.set(oldCameraPosition.x,oldCameraPosition.y,oldCameraPosition.z);
|
||||
controls.target.set( oldCameraTarget.x,oldCameraTarget.y,oldCameraTarget.z);
|
||||
passerStation.resetPosition(controls.drawGroup);
|
||||
}else if(controlMode == true){
|
||||
controls.controlMode = "Draw";
|
||||
oldCameraPosition.copy(camerass.position);
|
||||
oldCameraTarget.copy(controls.target);
|
||||
// camerass.position.set(0,300,0);
|
||||
// controls.target.set( 1, 0, 0 );
|
||||
passerStation.apartPosition(controls.drawGroup);
|
||||
controls.initPlaneMesh(passerStation);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//循环渲染函数
|
||||
function animate() {
|
||||
passerRender.update();
|
||||
render();
|
||||
// console.log(passerRender);
|
||||
// console.log("ss");
|
||||
// if(passerRender.state == "freeview"){
|
||||
controls.update();
|
||||
controls.update();
|
||||
// }
|
||||
// delta = clock.getDelta();
|
||||
|
||||
requestAnimationFrame(animate);
|
||||
|
||||
}
|
||||
function render() {
|
||||
|
||||
renderer.render( scene,camerass);
|
||||
|
||||
window.onresize = function () {
|
||||
passerRender.reSize(scope.dom.offsetWidth,scope.dom.offsetHeight);
|
||||
}
|
||||
|
||||
this.switchviews = function(viewmode){
|
||||
passerRender.changeRenderMode(viewmode);
|
||||
window.onresize = function () {
|
||||
renderer.setSize(scope.dom.offsetWidth,scope.dom.offsetHeight);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -130,7 +130,8 @@ function fbxpromise(asset,mixers,model){
|
||||
if( mode == "2"){
|
||||
loader.load( asset.url, function ( object ) {
|
||||
model.mesh = object;
|
||||
|
||||
console.log(asset.type);
|
||||
console.log(object);
|
||||
resolve(asset.deviceType);
|
||||
} );
|
||||
|
||||
|
||||
@ -17,7 +17,9 @@ var Staticmodel = [
|
||||
name: "车站",
|
||||
deviceType: "cctvStation",
|
||||
type: "cctvStation",
|
||||
url: BASE_ASSET_API + "/MODEL/2021-01-27/323-88925.FBX"///MODEL/2020-11-23/79-95086.FBX
|
||||
url: BASE_ASSET_API + "/MODEL/2021-02-20/1296-89217.FBX"
|
||||
//未分拆上下层模型 /MODEL/2021-01-27/323-88925.FBX
|
||||
//最早模型 /MODEL/2020-11-23/79-95086.FBX
|
||||
},{
|
||||
id: "4",
|
||||
name: "闸机",
|
||||
|
||||
225
src/jlmap3d/jl3dstationmanager/model/passerstation.js
Normal file
225
src/jlmap3d/jl3dstationmanager/model/passerstation.js
Normal file
@ -0,0 +1,225 @@
|
||||
import {Materialload} from '@/jlmap3d/main/loaders/Materialload.js';
|
||||
|
||||
export function PasserStation() {
|
||||
var scope = this;
|
||||
this.stationMesh = null;
|
||||
this.stationleft = [];
|
||||
this.stationright = [];
|
||||
//替换材质组(站台的)
|
||||
this.stationtexture = [];
|
||||
|
||||
this.stationlist = [];
|
||||
|
||||
this.nowStation = null;
|
||||
|
||||
this.top = null;
|
||||
this.down = null;
|
||||
let originTopPosition = new THREE.Vector3();
|
||||
let originDownPosition = new THREE.Vector3();
|
||||
this.topfloor = null;
|
||||
this.downfloor = null;
|
||||
|
||||
for(let i=0;i<22;i++){
|
||||
let sl = {
|
||||
id:"left"+i,
|
||||
status:0,
|
||||
waiting:0
|
||||
}
|
||||
scope.stationleft.push(sl);
|
||||
}
|
||||
|
||||
for(let i=0;i<22;i++){
|
||||
let sr = {
|
||||
id:"right"+i,
|
||||
status:0,
|
||||
waiting:0
|
||||
}
|
||||
scope.stationright.push(sr);
|
||||
}
|
||||
//初始化车站模型动画
|
||||
this.initStationAnimation = function( object,mixers ,deviceaction ,scene){
|
||||
let mixer = new THREE.AnimationMixer( object ,mixers ,deviceaction ,scene);
|
||||
|
||||
let newclip = object.animations[ 0 ];
|
||||
for(let j=0;j<object.children.length;j++){
|
||||
|
||||
if(object.children[j].name == "top"){
|
||||
// let geometry = new THREE.BoxBufferGeometry( 50, 50, 50 );
|
||||
// let material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
|
||||
// let cube = new THREE.Mesh( geometry, material );
|
||||
// cube.position.copy(object.children[j].position);
|
||||
// scene.add( cube );
|
||||
object.children[j].animations = [];
|
||||
object.children[j].animations.push(newclip.clone());
|
||||
|
||||
let mixer = new THREE.AnimationMixer( object.children[j] );
|
||||
|
||||
let action =mixer.clipAction( object.children[j].animations[0])
|
||||
action.setLoop(THREE.LoopOnce);
|
||||
action.clampWhenFinished = true;
|
||||
// action.play();
|
||||
|
||||
mixers.push(mixer);
|
||||
let device = {
|
||||
action:action,
|
||||
mixer:mixer,
|
||||
};
|
||||
deviceaction[object.children[j].name] = device;
|
||||
}
|
||||
if(object.children[j].name == "down"){
|
||||
object.children[j].animations = [];
|
||||
object.children[j].animations.push(newclip.clone());
|
||||
|
||||
let mixer = new THREE.AnimationMixer( object.children[j] );
|
||||
|
||||
|
||||
let action =mixer.clipAction( object.children[j].animations[0])
|
||||
// action.play();
|
||||
action.setLoop(THREE.LoopOnce);
|
||||
action.clampWhenFinished = true;
|
||||
|
||||
mixers.push(mixer);
|
||||
let device = {
|
||||
action:action,
|
||||
mixer:mixer,
|
||||
};
|
||||
deviceaction[object.children[j].name] = device;
|
||||
}
|
||||
}
|
||||
object.traverse( function ( child ) {
|
||||
|
||||
if ( child.isMesh ) {
|
||||
child.renderOrder = 9;
|
||||
}
|
||||
|
||||
} );
|
||||
scope.stationMesh = object;
|
||||
scope.top = object.getObjectByName("1");
|
||||
scope.down = object.getObjectByName("2");
|
||||
originTopPosition.copy(scope.top.position);
|
||||
originDownPosition.copy(scope.down.position);
|
||||
scope.topfloor = object.getObjectByName("1floor");
|
||||
scope.downfloor = object.getObjectByName("2floor");
|
||||
// console.log(deviceaction);
|
||||
scene.add(object);
|
||||
|
||||
}
|
||||
//初始化车站名称数据
|
||||
this.initStationList = function(stationdata,standdata,psddata){
|
||||
let list = [];
|
||||
if(psddata){
|
||||
for(let i=0,leni = standdata.length;i<leni;i++){
|
||||
for(let j=0,lenj = psddata.length;j<lenj;j++){
|
||||
if(standdata[i].code == psddata[j].standCode){
|
||||
standdata[i].name = psddata[j].code;
|
||||
}
|
||||
}
|
||||
}
|
||||
for(let i=0,leni = stationdata.length;i<leni;i++){
|
||||
if(stationdata[i].depot == false){
|
||||
list[stationdata[i].name] = [];
|
||||
for(let j=0,lenj = standdata.length;j<lenj;j++){
|
||||
if(standdata[j].stationCode == stationdata[i].code){
|
||||
list[stationdata[i].name].push(standdata[j]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
for(let k in list){
|
||||
if(list[k].length>0){
|
||||
let stationobject = {
|
||||
code : list[k][0].stationCode,
|
||||
name : k,
|
||||
toppsd:null,
|
||||
downpsd:null,
|
||||
topsection:null,
|
||||
downsection:null,
|
||||
};
|
||||
if(list[k][0].position.y<list[k][1].position.y){
|
||||
stationobject.toppsd = list[k][0].name;
|
||||
stationobject.downpsd = list[k][1].name;
|
||||
stationobject.topsection = list[k][0].standTrackCode;
|
||||
stationobject.downsection = list[k][1].standTrackCode;
|
||||
}else{
|
||||
stationobject.toppsd = list[k][1].name;
|
||||
stationobject.downpsd = list[k][0].name;
|
||||
stationobject.topsection = list[k][1].standTrackCode;
|
||||
stationobject.downsection = list[k][0].standTrackCode;
|
||||
}
|
||||
scope.stationlist.push(stationobject);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
scope.nowStation = scope.stationlist[0];
|
||||
if(scope.stationtexture["stationlist"]){
|
||||
scope.stationMesh.getObjectByName("zhantailiebiao").material.map =scope.stationtexture["stationlist"];
|
||||
scope.stationMesh.getObjectByName("zhantailiebiao").material.map.needsUpdate = true;
|
||||
if(scope.stationMesh.getObjectByName("menkuangyanse")){
|
||||
scope.stationMesh.getObjectByName("menkuangyanse").material.map =scope.stationtexture["pingbimen"];
|
||||
scope.stationMesh.getObjectByName("menkuangyanse").material.map.needsUpdate = true;
|
||||
}
|
||||
scope.stationMesh.getObjectByName("zhantaiming").material.map = scope.stationtexture[scope.nowStation.code];
|
||||
scope.stationMesh.getObjectByName("zhantaiming").material.map.needsUpdate = true;
|
||||
}
|
||||
updatestationlist(scope.stationlist);
|
||||
}else{
|
||||
olddataai = true;
|
||||
}
|
||||
}
|
||||
//加载线路车站名贴图
|
||||
this.loadMaterial = function(netdata3d){
|
||||
Materialload(scope,JSON.parse(netdata3d.data.assets).stationTextureList[0]);
|
||||
}
|
||||
|
||||
this.apartPosition = function(drawGroup){
|
||||
// scope.down.position.y = scope.top.position.y;
|
||||
scope.top.position.z += 75;
|
||||
scope.down.position.z -= 75;
|
||||
if(drawGroup.children.length>0){
|
||||
for(let i=0;i<drawGroup.children.length;i++){
|
||||
// drawGroup.children[i].position.y = scope.top.position.y;
|
||||
if(drawGroup.children[i].underFloor == "1floor"){
|
||||
drawGroup.children[i].position.z += 75;
|
||||
}
|
||||
if(drawGroup.children[i].underFloor == "2floor"){
|
||||
drawGroup.children[i].position.z -= 75;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.resetPosition = function(drawGroup){
|
||||
scope.top.position.copy(originTopPosition);
|
||||
scope.down.position.copy(originDownPosition);
|
||||
if(drawGroup.children.length>0){
|
||||
for(let i=0;i<drawGroup.children.length;i++){
|
||||
|
||||
if(drawGroup.children[i].underFloor == "1floor"){
|
||||
drawGroup.children[i].position.z -= 75;
|
||||
// drawGroup.children[i].position.y = scope.top.position.y;
|
||||
}
|
||||
if(drawGroup.children[i].underFloor == "2floor"){
|
||||
drawGroup.children[i].position.z += 75;
|
||||
// drawGroup.children[i].position.y = scope.down.position.y;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//更换场景车站
|
||||
this.changestation = function(stationname){
|
||||
for(let i=0,leni=scope.stationlist.length;i<leni;i++){
|
||||
if(scope.stationlist[i].name == stationname){
|
||||
scope.nowStation = scope.stationlist[i];
|
||||
|
||||
if(scope.stationtexture["stationlist"]){
|
||||
scope.stationMesh.getObjectByName("zhantaiming").material.map = scope.stationtexture[scope.nowStation.code];
|
||||
scope.stationMesh.getObjectByName("zhantaiming").material.map.needsUpdate = true;
|
||||
}
|
||||
i=leni;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -2,9 +2,9 @@ export function getBaseUrl() {
|
||||
let BASE_API;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// BASE_API = 'https://api.joylink.club/jlcloud';
|
||||
// BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
// BASE_API = 'http://192.168.8.107:9000'; // 袁琪
|
||||
BASE_API = 'http://192.168.8.129:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.8.129:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.8.119:9000'; // 张赛
|
||||
// BASE_API = 'http://192.168.8.140:9000'; // 杜康
|
||||
// BASE_API = 'http://b29z135112.zicp.vip';
|
||||
|
||||
172
src/views/jlmap3d/stationmanager/component/drawtype.vue
Normal file
172
src/views/jlmap3d/stationmanager/component/drawtype.vue
Normal file
@ -0,0 +1,172 @@
|
||||
<template>
|
||||
|
||||
|
||||
<el-tabs class="mapControl" :tab-position="tabPosition" v-model="activeName" type="card" @tab-click="handleClick" >
|
||||
|
||||
|
||||
<el-tab-pane label="基础区域绘制" name="trackedit" >
|
||||
<el-row>
|
||||
<el-button id="stationRegion" class="editbutton stationRegion" @click="actionClick($event)">入口区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="securityRegion" class="editbutton securityRegion" @click="actionClick($event)">安检区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="checkRegion" class="editbutton checkRegion" @click="actionClick($event)">闸机区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="standRegion" class="editbutton standRegion" @click="actionClick($event)">站台区域</el-button>
|
||||
</el-row>
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="功能区域绘制" name="switchedit">
|
||||
<el-row>
|
||||
<el-button id="ticketRegion" class="editbutton ticketRegion" @click="actionClick($event)">售票区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="elevatorRegion" class="editbutton elevatorRegion" @click="actionClick($event)">电梯区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="stairsRegion" class="editbutton stairsRegion" @click="actionClick($event)">楼梯区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="escalatorRegion" class="editbutton escalatorRegion" @click="actionClick($event)">扶梯区域</el-button>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-button id="unaccessRegion" class="editbutton unaccessRegion" @click="actionClick($event)">禁行区域</el-button>
|
||||
</el-row>
|
||||
|
||||
</el-tab-pane>
|
||||
|
||||
|
||||
</el-tabs>
|
||||
<!-- <div class="mapControl">
|
||||
|
||||
</div> -->
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'DrawType',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: '',
|
||||
tabPosition:'left',
|
||||
size:'medium',
|
||||
isActive:-1,
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
init: function() {
|
||||
|
||||
},
|
||||
back() {
|
||||
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
// console.log(tab);
|
||||
// if(tab.name == "pathedit"){
|
||||
// this.$emit('saction',this.activeName);
|
||||
// }
|
||||
this.isActive = -1;
|
||||
if(tab.name == "trackedit"){
|
||||
|
||||
}
|
||||
if(tab.name == "switchedit"){
|
||||
|
||||
}
|
||||
|
||||
if(tab.name == "signaledit"){
|
||||
|
||||
}
|
||||
if(tab.name == "stationedit"){
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
actionClick(element){
|
||||
let actionId = element.currentTarget.id;
|
||||
// console.log(element.currentTarget.id);
|
||||
this.$emit('changeDrawType',actionId);
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
.mapControl {
|
||||
position:absolute;
|
||||
float: left;
|
||||
left:0;
|
||||
width: 18%;
|
||||
height:70%;
|
||||
background:#fff;
|
||||
overflow-y:auto;
|
||||
z-index: 10;
|
||||
border-radius:0 30px 30px 0;
|
||||
border:1px solid #000;
|
||||
// border-radius:5px;
|
||||
// text-align: center;
|
||||
}
|
||||
.editmodelconfig{
|
||||
left:0;
|
||||
margin-top:5px;
|
||||
width:98%;
|
||||
border-radius:5px;
|
||||
border:solid 2px #000
|
||||
}
|
||||
.active{
|
||||
background-color:blue;
|
||||
}
|
||||
.editbutton{
|
||||
padding: 1cm
|
||||
}
|
||||
|
||||
.stationRegion{
|
||||
background:#2894FF;
|
||||
}
|
||||
.securityRegion{
|
||||
background:#FF0000;
|
||||
}
|
||||
.checkRegion{
|
||||
background:#9F35FF;
|
||||
}
|
||||
.standRegion{
|
||||
background:#00EC00;
|
||||
}
|
||||
.ticketRegion{
|
||||
background:#00FFFF;
|
||||
}
|
||||
.elevatorRegion{
|
||||
background:#FFFF37;
|
||||
}
|
||||
.stairsRegion{
|
||||
background:#FF5809;
|
||||
}
|
||||
.escalatorRegion{
|
||||
background:#5CADAD;
|
||||
}
|
||||
.unaccessRegion{
|
||||
background:#272727;
|
||||
}
|
||||
|
||||
</style>
|
||||
74
src/views/jlmap3d/stationmanager/component/manager.vue
Normal file
74
src/views/jlmap3d/stationmanager/component/manager.vue
Normal file
@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<div class="jl3dstationmanager">
|
||||
|
||||
<div id="jl3d" class="jl3dstationmanagerdraw">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Vue from 'vue';
|
||||
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
|
||||
|
||||
import { Jl3dStationManager } from '@/jlmap3d/jl3dstationmanager/jl3dstationmanager.js';
|
||||
|
||||
export default {
|
||||
name: 'ActionManager',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
localStatic:JL3D_LOCAL_STATIC,
|
||||
jl3d: null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
|
||||
this.initnewdata();
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
methods: {
|
||||
initnewdata: function (group,header){
|
||||
let dom = document.getElementById('jl3d');
|
||||
this.jl3d = new Jl3dStationManager(dom);
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
|
||||
.jl3dstationmanager{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.jl3dstationmanagerdraw {
|
||||
position: absolute;
|
||||
float: right;
|
||||
/* top:25%; */
|
||||
/* left: 0; */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
#canvastexture {
|
||||
position: absolute;
|
||||
float: left;
|
||||
left: 0;
|
||||
z-index: -12;
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
115
src/views/jlmap3d/stationmanager/component/property.vue
Normal file
115
src/views/jlmap3d/stationmanager/component/property.vue
Normal file
@ -0,0 +1,115 @@
|
||||
<template>
|
||||
|
||||
|
||||
<el-tabs class="mapControl" :tab-position="tabPosition" v-model="activeName" type="card" @tab-click="handleClick" >
|
||||
|
||||
|
||||
<el-tab-pane label="区域属性" name="trackedit" >
|
||||
|
||||
</el-tab-pane>
|
||||
|
||||
|
||||
<el-tab-pane label="仿真配置" name="switchedit">
|
||||
|
||||
|
||||
</el-tab-pane>
|
||||
|
||||
|
||||
</el-tabs>
|
||||
<!-- <div class="mapControl">
|
||||
|
||||
</div> -->
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'ProPerty',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: '',
|
||||
tabPosition:'top',
|
||||
size:'medium',
|
||||
isActive:-1,
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
||||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
init: function() {
|
||||
|
||||
},
|
||||
back() {
|
||||
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
// console.log(tab);
|
||||
// if(tab.name == "pathedit"){
|
||||
// this.$emit('saction',this.activeName);
|
||||
// }
|
||||
this.isActive = -1;
|
||||
if(tab.name == "trackedit"){
|
||||
|
||||
}
|
||||
if(tab.name == "switchedit"){
|
||||
|
||||
}
|
||||
|
||||
if(tab.name == "signaledit"){
|
||||
|
||||
}
|
||||
if(tab.name == "stationedit"){
|
||||
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
.mapControl {
|
||||
position:absolute;
|
||||
float: right;
|
||||
right:0;
|
||||
width: 18%;
|
||||
height:70%;
|
||||
background:#fff;
|
||||
overflow-y:auto;
|
||||
z-index: 10;
|
||||
border-radius:30px 0 0 30px;
|
||||
border:1px solid #000;
|
||||
// border-radius:5px;
|
||||
// text-align: center;
|
||||
}
|
||||
.editmodelconfig{
|
||||
left:0;
|
||||
margin-top:5px;
|
||||
width:98%;
|
||||
border-radius:5px;
|
||||
border:solid 2px #000
|
||||
}
|
||||
.active{
|
||||
background-color:blue;
|
||||
}
|
||||
.editbutton{
|
||||
padding: 1cm
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,6 +1,23 @@
|
||||
<template>
|
||||
<div class="jl3dstationmanager">
|
||||
<div id="jl3d" class="jl3ddraw">
|
||||
<el-row class="managerbutton">
|
||||
<el-button @click="switchViews" round>{{switchButtonName}}</el-button>
|
||||
<!-- 仿真操作按钮 -->
|
||||
<el-button round >显示隐藏区域</el-button>
|
||||
<el-button round >显示隐藏热力图</el-button>
|
||||
<!-- 绘图操作按钮 -->
|
||||
<el-button round >删除区域</el-button>
|
||||
<el-button round >移动操作</el-button>
|
||||
<el-button round>旋转操作</el-button>
|
||||
<el-button round>拉伸操作</el-button>
|
||||
<el-button round>保存方案</el-button>
|
||||
<el-button round>加载方案</el-button>
|
||||
<!-- 其他 -->
|
||||
<el-button round>退出</el-button>
|
||||
</el-row>
|
||||
<Draw-Type @changeDrawType=changeDrawType ></Draw-Type>
|
||||
<Pro-Perty></Pro-Perty>
|
||||
<div id="jl3d" class="jl3dstationmanagerdraw">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -10,14 +27,20 @@
|
||||
|
||||
import { Jl3dStationManager } from '@/jlmap3d/jl3dstationmanager/jl3dstationmanager.js';
|
||||
|
||||
import DrawType from '@/views/jlmap3d/stationmanager/component/drawtype';
|
||||
import ProPerty from '@/views/jlmap3d/stationmanager/component/property';
|
||||
export default {
|
||||
name: 'jl3devacuation',
|
||||
components: {
|
||||
DrawType,
|
||||
ProPerty,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
localStatic:JL3D_LOCAL_STATIC,
|
||||
jl3d: null,
|
||||
switchButtonName:'仿真视角',
|
||||
viewStatus:false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -39,13 +62,34 @@
|
||||
let dom = document.getElementById('jl3d');
|
||||
this.jl3d = new Jl3dStationManager(dom);
|
||||
},
|
||||
changeDrawType(drawTypeName){
|
||||
// console.log(drawTypeName);
|
||||
this.jl3d.changeDrawType(drawTypeName);
|
||||
},
|
||||
switchViews(){
|
||||
|
||||
if(this.viewStatus == false){
|
||||
this.switchButtonName = '绘制视角',
|
||||
this.viewStatus = true;
|
||||
this.jl3d.changeControlMode(true);
|
||||
}else if(this.viewStatus == true){
|
||||
this.switchButtonName = '仿真视角 ',
|
||||
this.viewStatus = false;
|
||||
this.jl3d.changeControlMode(false);
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
.jl3ddraw {
|
||||
|
||||
.jl3dstationmanager{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.jl3dstationmanagerdraw {
|
||||
position: absolute;
|
||||
float: right;
|
||||
/* top:25%; */
|
||||
@ -54,9 +98,12 @@
|
||||
height: 100%;
|
||||
z-index: 9;
|
||||
}
|
||||
.jl3dstationmanager{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.managerbutton{
|
||||
width:50%;
|
||||
left:25%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
#canvastexture {
|
||||
position: absolute;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user