1103 lines
29 KiB
JavaScript
1103 lines
29 KiB
JavaScript
|
import { Staticmodel } from '@/jlmap3d/jl3dpassflow/config.js';
|
||
|
//loader
|
||
|
import { FBXLoader } from '@/jlmap3d/main/loaders/FBXLoader';
|
||
|
import { OBJLoader } from '@/jlmap3d/main/loaders/OBJLoader';
|
||
|
|
||
|
import { OrbitControls } from '@/jlmap3d/main/control/OrbitControls';
|
||
|
|
||
|
import { ModelManager } from '@/jlmap3d/jl3dpassflow/loader.js';
|
||
|
import { SkeletonUtils } from '@/jlmap3d/main/utils/SkeletonUtils.js';
|
||
|
|
||
|
import { Pathfinding } from '@/jlmap3d/jl3dpassflow/utils/Pathfinding.js';
|
||
|
// const Pathfinding = window.threePathfinding.Pathfinding;
|
||
|
import { ZoneManager } from '@/jlmap3d/jl3dpassflow/model/zonemanager.js';
|
||
|
|
||
|
import StompClient from '@/utils/sock';
|
||
|
import { Loading } from 'element-ui';
|
||
|
|
||
|
// const Pathfinding = window.threePathfinding.Pathfinding;
|
||
|
var clock = new THREE.Clock();
|
||
|
let delta;
|
||
|
let scene,camerass,renderer;
|
||
|
let rendermode = 0;
|
||
|
|
||
|
var mixers = [];
|
||
|
var testmesh1,testmesh2;
|
||
|
var humans = [];
|
||
|
var checkdoor1 = [];
|
||
|
var checkdoor2 = [];
|
||
|
var station;
|
||
|
var zhajiinmodel;
|
||
|
var zhajioutmodel;
|
||
|
var monitor;
|
||
|
let ids = 0;
|
||
|
|
||
|
let humanlist = new THREE.Group();
|
||
|
|
||
|
let originhuman1 = null;
|
||
|
let originhuman2 = null;
|
||
|
let originanima1 = null;
|
||
|
let originanima2 = null;
|
||
|
let moveanimatelist = [];
|
||
|
|
||
|
let zhajiin = [];
|
||
|
let zhajiout = [];
|
||
|
|
||
|
let deviceaction = [];
|
||
|
|
||
|
let passerwebwork = new Worker("../../static/workertest/passsimulation/passer.js");
|
||
|
let stationwebwork = new Worker("../../static/workertest/passsimulation/station.js");
|
||
|
|
||
|
let stationzon = new ZoneManager();
|
||
|
|
||
|
for(let i=0;i<5;i++){
|
||
|
checkdoor1[i]={
|
||
|
id:"c1"+i,
|
||
|
status:0,
|
||
|
pos:[],
|
||
|
max:10
|
||
|
};
|
||
|
}
|
||
|
|
||
|
for(let i=0;i<5;i++){
|
||
|
let zhaji = {
|
||
|
id:"in0"+(i+1),
|
||
|
status:0,
|
||
|
waiting:0
|
||
|
}
|
||
|
zhajiin.push(zhaji);
|
||
|
}
|
||
|
|
||
|
for(let i=0;i<5;i++){
|
||
|
let zhaji = {
|
||
|
id:"out0"+(i+1),
|
||
|
status:0,
|
||
|
waiting:0
|
||
|
}
|
||
|
zhajiout.push(zhaji);
|
||
|
}
|
||
|
|
||
|
let stationleft = [];
|
||
|
let stationright = [];
|
||
|
|
||
|
for(let i=0;i<22;i++){
|
||
|
let sl = {
|
||
|
id:"left"+i,
|
||
|
status:0,
|
||
|
waiting:0
|
||
|
}
|
||
|
stationleft.push(sl);
|
||
|
}
|
||
|
|
||
|
for(let i=0;i<22;i++){
|
||
|
let sr = {
|
||
|
id:"right"+i,
|
||
|
status:0,
|
||
|
waiting:0
|
||
|
}
|
||
|
stationright.push(sr);
|
||
|
}
|
||
|
|
||
|
var windowWidth = window.innerWidth ;
|
||
|
var windowHeight = window.innerHeight;
|
||
|
var views = [
|
||
|
{
|
||
|
left: 0,
|
||
|
bottom: 0,
|
||
|
width: 0.5,
|
||
|
height: 0.5,
|
||
|
background: new THREE.Color( 0.5, 0.5, 0.7 ),
|
||
|
eye: [ 3.7, 16, 26 ],
|
||
|
up: [3.7, 10 ,16 ],
|
||
|
fov: 30
|
||
|
},
|
||
|
{
|
||
|
left: 0,
|
||
|
bottom: 0.5,
|
||
|
width: 0.5,
|
||
|
height: 0.5,
|
||
|
background: new THREE.Color( 0.5, 0.5, 0.7 ),
|
||
|
eye: [ 3.7,17,-4 ],
|
||
|
up: [ 3.7, 10 ,16],
|
||
|
fov: 30
|
||
|
},
|
||
|
{
|
||
|
left: 0.5,
|
||
|
bottom: 0,
|
||
|
width: 0.5,
|
||
|
height: 0.5,
|
||
|
background: new THREE.Color( 0.7, 0.5, 0.5 ),
|
||
|
eye: [ -60, 6,11],
|
||
|
up: [ -59, 5.9,11 ],
|
||
|
fov: 45
|
||
|
},
|
||
|
{
|
||
|
left: 0.5,
|
||
|
bottom: 0.5,
|
||
|
width: 0.5,
|
||
|
height: 0.5,
|
||
|
background: new THREE.Color( 0.5, 0.7, 0.7 ),
|
||
|
eye: [ -7,17,2],
|
||
|
up: [-7, 10, 8],
|
||
|
fov: 60
|
||
|
}
|
||
|
];
|
||
|
|
||
|
|
||
|
export function Jl3dpassflow(dom) {
|
||
|
var scope = this;
|
||
|
|
||
|
this.dom = dom;
|
||
|
this.nowcode = null;
|
||
|
this.animateswitch = false;
|
||
|
this.signallights = [];
|
||
|
this.mixers = [];
|
||
|
this.showmodel = null;
|
||
|
//初始化webgl渲染
|
||
|
renderer = new THREE.WebGLRenderer({ antialias: true });
|
||
|
|
||
|
renderer.setClearColor(new THREE.Color(0x000000));
|
||
|
renderer.setSize(dom.offsetWidth, dom.offsetHeight);
|
||
|
|
||
|
this.dom.appendChild(renderer.domElement);
|
||
|
|
||
|
//定义相机
|
||
|
|
||
|
camerass = new THREE.PerspectiveCamera(70, dom.offsetWidth / dom.offsetHeight, 0.01, 1000);
|
||
|
camerass.position.set(0, 80, 40);
|
||
|
camerass.aspect = dom.offsetWidth / dom.offsetHeight;
|
||
|
camerass.updateProjectionMatrix();
|
||
|
|
||
|
for ( var ii = 0; ii < views.length; ++ ii ) {
|
||
|
|
||
|
var view = views[ ii ];
|
||
|
var camera = new THREE.PerspectiveCamera( view.fov, window.innerWidth / window.innerHeight, 1, 200 );
|
||
|
camera.position.fromArray( view.eye );
|
||
|
camera.lookAt( view.up[0],view.up[1],view.up[2] );
|
||
|
view.camera = camera;
|
||
|
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
//定义场景(渲染容器)
|
||
|
scene = new THREE.Scene();
|
||
|
scene.background = new THREE.Color(0xa0a0a0);
|
||
|
|
||
|
var mesh = new THREE.Mesh(new THREE.PlaneBufferGeometry(200, 200), new THREE.MeshPhongMaterial({ color: 0x999999, depthWrite: false }));
|
||
|
mesh.rotation.x = - Math.PI / 2;
|
||
|
mesh.receiveShadow = true;
|
||
|
scene.add(mesh);
|
||
|
|
||
|
var grid = new THREE.GridHelper(200, 20, 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);
|
||
|
|
||
|
//
|
||
|
// var spotLight = new THREE.SpotLight(0xffffff);
|
||
|
// spotLight.position.set(-50, 60, 15);
|
||
|
// spotLight.castShadow = true;
|
||
|
// spotLight.shadow.mapSize.width = 1024;
|
||
|
// spotLight.shadow.mapSize.height = 1024;
|
||
|
// scene.add(spotLight);
|
||
|
|
||
|
|
||
|
|
||
|
this.controls = new THREE.OrbitControls(camerass, dom);
|
||
|
this.controls.maxPolarAngle = Math.PI / 2;
|
||
|
this.controls.minPolarangle = Math.PI / 5;
|
||
|
this.controls.maxDistance = 800;
|
||
|
this.controls.screenSpacePanning = true;
|
||
|
this.controls.update();
|
||
|
this.selectmodel = null;
|
||
|
|
||
|
|
||
|
const Color = {
|
||
|
GROUND: new THREE.Color( 0x606060 ).convertGammaToLinear( 2.2 ).getHex(),
|
||
|
NAVMESH: new THREE.Color( 0xFFFFFF ).convertGammaToLinear( 2.2 ).getHex(),
|
||
|
};
|
||
|
|
||
|
const ZONE = 'level';
|
||
|
const SPEED = 10;
|
||
|
const OFFSET = 0.2;
|
||
|
|
||
|
THREE.Pathfinding = Pathfinding;
|
||
|
|
||
|
let level, navmesh;
|
||
|
|
||
|
let groupID, path;
|
||
|
|
||
|
const playerPosition = new THREE.Vector3( -3.5, 0.5, 5.5 );
|
||
|
const targetPosition = new THREE.Vector3();
|
||
|
|
||
|
const pathfinder = new THREE.Pathfinding();
|
||
|
const mouse = new THREE.Vector2();
|
||
|
const raycaster = new THREE.Raycaster();
|
||
|
|
||
|
var loader = new THREE.OBJLoader();
|
||
|
|
||
|
// load a resource
|
||
|
loader.load(
|
||
|
// resource URL
|
||
|
'../../static/model/path/path.obj',
|
||
|
// called when resource is loaded
|
||
|
function ( object ) {
|
||
|
|
||
|
|
||
|
console.time('createZone()');
|
||
|
const zone = THREE.Pathfinding.createZone(object.children[0].geometry);
|
||
|
console.timeEnd('createZone()');
|
||
|
|
||
|
pathfinder.setZoneData( ZONE, zone );
|
||
|
|
||
|
const navWireframe = new THREE.Mesh(object.children[0].geometry, new THREE.MeshBasicMaterial({
|
||
|
color: 0x808080,
|
||
|
wireframe: true
|
||
|
}));
|
||
|
navWireframe.position.y = OFFSET / 2;
|
||
|
// scene.add(navWireframe);
|
||
|
|
||
|
navmesh = object.children[0];
|
||
|
// scene.add(navmesh);
|
||
|
|
||
|
// Set the player's navigation mesh group
|
||
|
groupID = pathfinder.getGroup( ZONE, playerPosition );
|
||
|
|
||
|
},
|
||
|
// called when loading is in progresses
|
||
|
function ( xhr ) {
|
||
|
|
||
|
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
|
||
|
|
||
|
},
|
||
|
// called when loading has errors
|
||
|
function ( error ) {
|
||
|
|
||
|
console.log( 'An error happened' );
|
||
|
|
||
|
}
|
||
|
);
|
||
|
document.addEventListener( 'mouseup', onDocumentMouseUp, false );
|
||
|
|
||
|
function onDocumentMouseUp (event) {
|
||
|
|
||
|
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
|
||
|
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
|
||
|
|
||
|
|
||
|
camerass.updateMatrixWorld();
|
||
|
|
||
|
raycaster.setFromCamera( mouse, camerass );
|
||
|
|
||
|
const intersects = raycaster.intersectObject( navmesh );
|
||
|
|
||
|
if ( !intersects.length ) return;
|
||
|
console.log(intersects[0].point);
|
||
|
targetPosition.copy( intersects[0].point );
|
||
|
|
||
|
originhuman1.position.copy( playerPosition );
|
||
|
// Teleport on ctrl/cmd click or RMB.
|
||
|
if (event.metaKey || event.ctrlKey || event.button === 2) {
|
||
|
|
||
|
path = null;
|
||
|
originhuman1.position.copy( playerPosition.copy( targetPosition ) );
|
||
|
|
||
|
return;
|
||
|
|
||
|
}
|
||
|
|
||
|
path = pathfinder.findPath( playerPosition, targetPosition, ZONE, groupID );
|
||
|
|
||
|
let points = [];
|
||
|
points.push(new THREE.Vector3(originhuman1.position.x,originhuman1.position.y,originhuman1.position.z));
|
||
|
for(let i=0;i<path.length;i++){
|
||
|
points.push(path[i]);
|
||
|
}
|
||
|
originhuman1.curve = new THREE.CatmullRomCurve3(points);
|
||
|
originhuman1.curve.curvrtype = "chordal";
|
||
|
originhuman1.progress = 0;
|
||
|
console.log(path);
|
||
|
|
||
|
}
|
||
|
|
||
|
function tick ( dt ) {
|
||
|
// if ( !level || !(path||[]).length ) return
|
||
|
//
|
||
|
// let targetPosition = path[ 0 ];
|
||
|
// const velocity = targetPosition.clone().sub( playerPosition );
|
||
|
//
|
||
|
// if (velocity.lengthSq() > 0.05 * 0.05) {
|
||
|
// velocity.normalize();
|
||
|
// // Move player to target
|
||
|
// playerPosition.add( velocity.multiplyScalar( dt * SPEED ) );
|
||
|
// // originhuman1.lookAt();
|
||
|
// originhuman1.position.copy( playerPosition );
|
||
|
// } else {
|
||
|
// // Remove node from the path we calculated
|
||
|
// path.shift();
|
||
|
// }
|
||
|
if(originhuman1.curve){
|
||
|
if(originhuman1.progress<1){
|
||
|
let point = originhuman1.curve.getPointAt(originhuman1.progress);
|
||
|
|
||
|
//更新模型坐标
|
||
|
originhuman1.position.x = point.x;
|
||
|
originhuman1.position.y = point.y;
|
||
|
originhuman1.position.z = point.z;
|
||
|
if((originhuman1.progress+0.001)<1){
|
||
|
let tangent = originhuman1.curve.getPointAt(originhuman1.progress+0.001);
|
||
|
originhuman1.lookAt(new THREE.Vector3(tangent.x,originhuman1.position.y,tangent.z));
|
||
|
}
|
||
|
|
||
|
originhuman1.progress += 0.05;
|
||
|
}else{
|
||
|
playerPosition.copy( originhuman1.position )
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
window.onresize = function () {
|
||
|
|
||
|
renderer.setSize(scope.dom.offsetWidth, scope.dom.offsetHeight);
|
||
|
windowWidth = scope.dom.offsetWidth ;
|
||
|
windowHeight = scope.dom.offsetHeight;
|
||
|
|
||
|
camerass.aspect = scope.dom.offsetWidth / scope.dom.offsetHeight;
|
||
|
camerass.updateProjectionMatrix();
|
||
|
}
|
||
|
|
||
|
this.anime = null;
|
||
|
|
||
|
this.modelmanager = new ModelManager();
|
||
|
let loadingInstance = Loading.service({ fullscreen: true });
|
||
|
this.modelmanager.loadpromise(Staticmodel, scope.mixers).then(function (data) {
|
||
|
// console.log(scope.modelmanager);
|
||
|
initstationanimation(scope.modelmanager.station.mesh);
|
||
|
initzhajiinaimation(scope.modelmanager.zhajiin.mesh);
|
||
|
initzhajioutanimation(scope.modelmanager.zhajiout.mesh);
|
||
|
|
||
|
level = scope.modelmanager.station.mesh;
|
||
|
|
||
|
monitor = scope.modelmanager.monitor.mesh;
|
||
|
scene.add(monitor);
|
||
|
|
||
|
|
||
|
|
||
|
|
||
|
inithumans();
|
||
|
|
||
|
loadingInstance.close();
|
||
|
|
||
|
scope.switchrender(true);
|
||
|
|
||
|
animate();
|
||
|
})
|
||
|
|
||
|
function inithumans(){
|
||
|
|
||
|
originhuman1 = scope.modelmanager.man1.mesh;
|
||
|
originhuman1.progress = 1;
|
||
|
scene.add(originhuman1);
|
||
|
originhuman2 = scope.modelmanager.man2.mesh;
|
||
|
let mixer1 = new THREE.AnimationMixer( originhuman1 );
|
||
|
let mixer2 = new THREE.AnimationMixer( originhuman2 );
|
||
|
originanima1 = originhuman1.animations[ 0 ];
|
||
|
originanima2 = originhuman2.animations[ 0 ];
|
||
|
originhuman1.remove(originhuman1.children[2]);
|
||
|
scene.add(humanlist);
|
||
|
scene.add(scope.modelmanager.man1.mesh);
|
||
|
|
||
|
for(let i=0;i<200;i++){
|
||
|
var mantype = Math.floor(Math.random()*(3-1+1))+1;
|
||
|
let newhuman;
|
||
|
if(mantype == 1){
|
||
|
newhuman = THREE.SkeletonUtils.clone( originhuman1 );
|
||
|
newhuman.animations = [];
|
||
|
newhuman.animations.push(originanima1.clone());
|
||
|
}else{
|
||
|
newhuman = THREE.SkeletonUtils.clone( originhuman2 );
|
||
|
newhuman.animations = [];
|
||
|
newhuman.animations.push(originanima2.clone());
|
||
|
}
|
||
|
|
||
|
// zhajiin[j].waiting = 1;
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newhuman );
|
||
|
mixer.runplay = false;
|
||
|
let action = mixer.clipAction( newhuman.animations[ 0 ] );
|
||
|
|
||
|
newhuman.status = 1;
|
||
|
newhuman.stage = 0;
|
||
|
let newone = {
|
||
|
id:i,
|
||
|
mesh:newhuman,
|
||
|
direct:null,
|
||
|
doorstatus:null,
|
||
|
doors:null,
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
runrail:null
|
||
|
};
|
||
|
|
||
|
|
||
|
|
||
|
humans.push(newone);
|
||
|
mixers.push(mixer);
|
||
|
humanlist.add(newhuman);
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
}
|
||
|
|
||
|
|
||
|
let checkobject = setInterval(function(){
|
||
|
// console.log(originhuman1);
|
||
|
if(originhuman1){
|
||
|
console.log("start");
|
||
|
clearInterval(checkobject);
|
||
|
//进站控制
|
||
|
startWorker();
|
||
|
// stationwebwork.postMessage("on");
|
||
|
// passerwebwork.postMessage("on");
|
||
|
|
||
|
};
|
||
|
},1000);
|
||
|
|
||
|
|
||
|
|
||
|
this.switchrender = function(mode){
|
||
|
if(mode){
|
||
|
rendermode = 0;
|
||
|
renderer.setViewport( 0, 0, scope.dom.offsetWidth, scope.dom.offsetHeight );
|
||
|
renderer.setScissor( 0, 0, scope.dom.offsetWidth, scope.dom.offsetHeight );
|
||
|
renderer.setScissorTest( false );
|
||
|
renderer.setSize(scope.dom.offsetWidth, scope.dom.offsetHeight);
|
||
|
camerass.aspect = dom.offsetWidth / dom.offsetHeight;
|
||
|
camerass.updateProjectionMatrix();
|
||
|
}else{
|
||
|
rendermode = 1;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function startWorker(){
|
||
|
passerwebwork.onmessage = function (event) {
|
||
|
if(humans){
|
||
|
// console.log(humans.length);
|
||
|
|
||
|
// console.log(humans.length);
|
||
|
for(let i=0;i<humans.length;i++){
|
||
|
// console.log(humans[i]);
|
||
|
|
||
|
if(humans[i].status == 0){
|
||
|
|
||
|
if(humans[i].stage == 1){
|
||
|
let points = [];
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x,humans[i].mesh.position.y,humans[i].mesh.position.z));
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x,humans[i].mesh.position.y,humans[i].mesh.position.z-5));
|
||
|
zhajicontrol("in",humans[i].doors);
|
||
|
moveanimateinit(humans[i],i,points,i,0.02);
|
||
|
}
|
||
|
if(humans[i].stage == 2){
|
||
|
let points = [];
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x,humans[i].mesh.position.y,humans[i].mesh.position.z));
|
||
|
points.push(new THREE.Vector3(12,10,12.9));
|
||
|
points.push(new THREE.Vector3(28,1.7,12.9));
|
||
|
points.push(new THREE.Vector3(34,1.7,12.9));
|
||
|
|
||
|
//1--left
|
||
|
//2-- right
|
||
|
if(humans[i].direct == 1){
|
||
|
points.push(new THREE.Vector3(34,1.7,16));
|
||
|
for(let j =0;j<22;j++){
|
||
|
if(stationleft[j].waiting == 0){
|
||
|
|
||
|
points.push(new THREE.Vector3(51-j*5,1.7,22));
|
||
|
|
||
|
points.push(new THREE.Vector3(51-j*5,1.7,23));
|
||
|
|
||
|
humans[i].doors = j;
|
||
|
stationright[j].waiting = 1;
|
||
|
moveanimateinit(humans[i],i,points,i,0.002);
|
||
|
j =22;
|
||
|
}
|
||
|
}
|
||
|
}else{
|
||
|
points.push(new THREE.Vector3(34,1.7,16));
|
||
|
points.push(new THREE.Vector3(14,1.7,17));
|
||
|
points.push(new THREE.Vector3(14,1.7,3));
|
||
|
for(let j =0;j<22;j++){
|
||
|
if(stationright[j].waiting == 0){
|
||
|
|
||
|
points.push(new THREE.Vector3(51-j*5,1.7,3));
|
||
|
|
||
|
points.push(new THREE.Vector3(51-j*5,1.7,2));
|
||
|
humans[i].doors = j;
|
||
|
stationright[j].waiting = 1;
|
||
|
moveanimateinit(humans[i],i,points,i,0.002);
|
||
|
j =22;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
moveanimateinit(humans[i],i,points,i,0.002);
|
||
|
}
|
||
|
//出站
|
||
|
if(humans[i].stage == 3){
|
||
|
let points = [];
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x,humans[i].mesh.position.y,humans[i].mesh.position.z));
|
||
|
if(humans[i].doors<11){
|
||
|
if(humans[i].direct == 1){
|
||
|
points.push(new THREE.Vector3(10,1.7,17));
|
||
|
}else{
|
||
|
points.push(new THREE.Vector3(8,1.7,5));
|
||
|
}
|
||
|
points.push(new THREE.Vector3(8,1.7,13));
|
||
|
points.push(new THREE.Vector3(5,1.7,13));
|
||
|
points.push(new THREE.Vector3(-4,6,13));
|
||
|
}else{
|
||
|
if(humans[i].direct == 1){
|
||
|
points.push(new THREE.Vector3(-19,1.7,17));
|
||
|
}else{
|
||
|
points.push(new THREE.Vector3(-18,1.7,6.4));
|
||
|
}
|
||
|
points.push(new THREE.Vector3(-18,1.7,13));
|
||
|
points.push(new THREE.Vector3(-12,1.7,13));
|
||
|
points.push(new THREE.Vector3(-7,6.8,12));
|
||
|
}
|
||
|
points.push(new THREE.Vector3(-5,10,4));
|
||
|
points.push(new THREE.Vector3(14,10,3));
|
||
|
var j = Math.floor(Math.random()*(4-1+1))+1;
|
||
|
points.push(new THREE.Vector3(19,10,-2+j*1.4));
|
||
|
|
||
|
humans[i].doors = j;
|
||
|
moveanimateinit(humans[i],i,points,i,0.002);
|
||
|
}
|
||
|
if(humans[i].stage == 4){
|
||
|
|
||
|
let points = [];
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x,humans[i].mesh.position.y,humans[i].mesh.position.z));
|
||
|
|
||
|
points.push(new THREE.Vector3(humans[i].mesh.position.x+4,humans[i].mesh.position.y,humans[i].mesh.position.z));
|
||
|
|
||
|
if(humans[i].direct == 1){
|
||
|
points.push(new THREE.Vector3(33,10,25));
|
||
|
}else{
|
||
|
points.push(new THREE.Vector3(33.5,10,-5));
|
||
|
}
|
||
|
zhajicontrol("out",humans[i].doors);
|
||
|
moveanimateinit(humans[i],i,points,i,0.002);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
moveanimateupdate();
|
||
|
// delta = clock.getDelta();
|
||
|
// tick(delta);
|
||
|
|
||
|
if(mixers[i]._actions[0].isRunning()){
|
||
|
mixers[i].update( delta );
|
||
|
}
|
||
|
|
||
|
for(let i=mixers.length-1;i>=0;i--){
|
||
|
if(mixers[i]._actions[0].isRunning()){
|
||
|
mixers[i].update( delta );
|
||
|
}
|
||
|
}
|
||
|
|
||
|
};
|
||
|
stationwebwork.onmessage = function (event) {
|
||
|
// console.log("stationwebwork");
|
||
|
if(humans.length<200){
|
||
|
newhumancreate();
|
||
|
}
|
||
|
};
|
||
|
}
|
||
|
|
||
|
|
||
|
//循环渲染函数
|
||
|
function animate() {
|
||
|
// console.log(rendermode);
|
||
|
if(rendermode == 0){
|
||
|
renderer.render(scene, camerass);
|
||
|
scope.controls.update();
|
||
|
}else{
|
||
|
monitorrender();
|
||
|
}
|
||
|
|
||
|
delta = clock.getDelta();
|
||
|
tick(delta);
|
||
|
requestAnimationFrame(animate);
|
||
|
|
||
|
}
|
||
|
|
||
|
function moveanimateinit(model,name,points,index,speed){
|
||
|
|
||
|
let curve = new THREE.CatmullRomCurve3(points);
|
||
|
curve.curvrtype = "chordal";
|
||
|
// curve.getLength();
|
||
|
// curve动画轨迹
|
||
|
// progress动画进度
|
||
|
// enable当前动画开关
|
||
|
// speed动画速度
|
||
|
// console.log(curve);
|
||
|
let animate = {
|
||
|
name:index,
|
||
|
index:index,
|
||
|
curve:curve,
|
||
|
progress:0,
|
||
|
directchange:false,
|
||
|
enable:true,
|
||
|
status:"start",
|
||
|
speed:speed,
|
||
|
};
|
||
|
humans[index].runrail = animate;
|
||
|
humans[index].status = 1;
|
||
|
humans[index].action.play();
|
||
|
humans[index].mixer.runplay = true;
|
||
|
moveanimatelist.push(animate);
|
||
|
}
|
||
|
|
||
|
function moveanimateupdate(){
|
||
|
if(humans.length>0){
|
||
|
for(let i=0;i<humans.length;i++){
|
||
|
if(humans[i].runrail.enable){
|
||
|
// 动画播放结束
|
||
|
if(humans[i].runrail.progress>=1){
|
||
|
// let point = humans[i].runrail.curve.getPointAt(1);
|
||
|
//更新模型坐标
|
||
|
// console.log(moveanimatelist);
|
||
|
if(humans[i].status == 1){
|
||
|
humans[i].runrail.enable = false;
|
||
|
humans[i].runrail.progress = 1;
|
||
|
humans[i].mixer.runplay = false;
|
||
|
humans[i].action.stop();
|
||
|
humans[i].status = 0;
|
||
|
|
||
|
if(humans[i].stage == 4){
|
||
|
|
||
|
humanlist.remove(humans[i].mesh);
|
||
|
// humans.splice(i,1);
|
||
|
}
|
||
|
|
||
|
if(humans[i].stage == 3){
|
||
|
|
||
|
if(humans[i].direct == 1){
|
||
|
|
||
|
stationleft[humans[i].doors].waiting = 0;
|
||
|
}else{
|
||
|
|
||
|
stationright[humans[i].doors].waiting = 0;
|
||
|
}
|
||
|
humans[i].stage = 4;
|
||
|
|
||
|
}
|
||
|
|
||
|
if(humans[i].stage == 2){
|
||
|
humans[i].stage = 3;
|
||
|
|
||
|
}
|
||
|
|
||
|
if(humans[i].stage == 1){
|
||
|
|
||
|
|
||
|
humans[i].stage = 2;
|
||
|
|
||
|
}
|
||
|
|
||
|
if(humans[i].stage == 0){
|
||
|
// console.log(humans[i].doors);
|
||
|
zhajiin[humans[i].doors].waiting = 0;
|
||
|
humans[i].stage = 1;
|
||
|
}
|
||
|
|
||
|
moveanimatelist.splice(i,1);
|
||
|
|
||
|
}
|
||
|
|
||
|
}else{
|
||
|
//根据动画进度获取动画轨迹上点
|
||
|
|
||
|
let point = humans[i].runrail.curve.getPointAt(humans[i].runrail.progress);
|
||
|
|
||
|
//更新模型坐标
|
||
|
humans[i].mesh.position.x = point.x;
|
||
|
humans[i].mesh.position.y = point.y;
|
||
|
humans[i].mesh.position.z = point.z;
|
||
|
if((humans[i].runrail.progress+0.001)<1){
|
||
|
let tangent = humans[i].runrail.curve.getPointAt(humans[i].runrail.progress+0.001);
|
||
|
humans[i].mesh.lookAt(new THREE.Vector3(tangent.x,humans[i].mesh.position.y,tangent.z));
|
||
|
}
|
||
|
|
||
|
humans[i].runrail.progress += humans[i].runrail.speed;
|
||
|
point = null;
|
||
|
|
||
|
}
|
||
|
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
function newhumancreate(){
|
||
|
var direct = Math.floor(Math.random()*(3-1+1))+1;
|
||
|
var mantype = Math.floor(Math.random()*(3-1+1))+1;
|
||
|
// console.log(direct);
|
||
|
let points = [];
|
||
|
let newhuman;
|
||
|
if(mantype == 1){
|
||
|
newhuman = THREE.SkeletonUtils.clone( originhuman1 );
|
||
|
newhuman.animations = [];
|
||
|
newhuman.animations.push(originanima1.clone());
|
||
|
}else{
|
||
|
newhuman = THREE.SkeletonUtils.clone( originhuman2 );
|
||
|
newhuman.animations = [];
|
||
|
newhuman.animations.push(originanima2.clone());
|
||
|
}
|
||
|
|
||
|
if(direct == 1|| direct == 2){
|
||
|
let testposition = stationzon.getzoneposition("enter1");
|
||
|
newhuman.position.set(32,10,25);
|
||
|
points.push(testposition);
|
||
|
points.push(new THREE.Vector3(26,10,21));
|
||
|
points.push(new THREE.Vector3(18,10,18));
|
||
|
}else{
|
||
|
let testposition = stationzon.getzoneposition("enter2");
|
||
|
newhuman.position.set(32,10,-5);
|
||
|
points.push(testposition);
|
||
|
points.push(new THREE.Vector3(26,10,12));
|
||
|
points.push(new THREE.Vector3(24,10,17));
|
||
|
points.push(new THREE.Vector3(18,10,18));
|
||
|
}
|
||
|
|
||
|
let j = Math.floor(Math.random()*(4-1+1))+1;
|
||
|
points.push(new THREE.Vector3(-0.5+j*1.4,10,18.5));
|
||
|
// zhajiin[j].waiting = 1;
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newhuman );
|
||
|
mixer.runplay = false;
|
||
|
let action = mixer.clipAction( newhuman.animations[ 0 ] );
|
||
|
|
||
|
var stationdirection = Math.floor(Math.random()*(2-1+1))+1;
|
||
|
let newone = {
|
||
|
id:humans.length,
|
||
|
mesh:newhuman,
|
||
|
status:1,
|
||
|
stage:0,
|
||
|
direct:stationdirection,
|
||
|
doorstatus:null,
|
||
|
doors:j,
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
runrail:null
|
||
|
};
|
||
|
|
||
|
humans.push(newone);
|
||
|
mixers.push(mixer);
|
||
|
humanlist.add(newhuman);
|
||
|
|
||
|
|
||
|
moveanimateinit(newone,humans.length,points,newone.id,0.002);
|
||
|
|
||
|
// return newone;
|
||
|
}
|
||
|
|
||
|
function initstationanimation(object){
|
||
|
let mixer = new THREE.AnimationMixer( object );
|
||
|
|
||
|
let newclip = object.animations[ 0 ];
|
||
|
for(let j=0;j<object.children.length;j++){
|
||
|
|
||
|
if(object.children[j].name == "top"){
|
||
|
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();
|
||
|
mixer.runplay = true;
|
||
|
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;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[j].name] = device;
|
||
|
}
|
||
|
}
|
||
|
station = object;
|
||
|
scene.add(object);
|
||
|
|
||
|
}
|
||
|
|
||
|
function initzhajiinaimation(object){
|
||
|
let mixer = new THREE.AnimationMixer( object );
|
||
|
let newclip = object.animations[ 0 ];
|
||
|
let newzhaji = object;
|
||
|
for(let i=0;i<newzhaji.children.length;i++){
|
||
|
if(newzhaji.children[i].name == "in01"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "in02"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "in03"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "in04"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "in05"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
|
||
|
}
|
||
|
zhajiinmodel = newzhaji;
|
||
|
scene.add(newzhaji);
|
||
|
|
||
|
}
|
||
|
|
||
|
function initzhajioutanimation(object){
|
||
|
let mixer = new THREE.AnimationMixer( object );
|
||
|
let newclip = object.animations[ 0 ];
|
||
|
let newzhaji = object;
|
||
|
for(let i=0;i<newzhaji.children.length;i++){
|
||
|
|
||
|
if(newzhaji.children[i].name == "out01"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "out02"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "out03"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "out04"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
if(newzhaji.children[i].name == "out05"){
|
||
|
newzhaji.children[i].animations = [];
|
||
|
newzhaji.children[i].animations.push(newclip.clone());
|
||
|
|
||
|
let mixer = new THREE.AnimationMixer( newzhaji.children[i] );
|
||
|
|
||
|
let action =mixer.clipAction( newzhaji.children[i].animations[0]);
|
||
|
action.setLoop(THREE.LoopOnce);
|
||
|
action.clampWhenFinished = true;
|
||
|
mixer.runplay = true;
|
||
|
mixers.push(mixer);
|
||
|
let device = {
|
||
|
action:action,
|
||
|
mixer:mixer,
|
||
|
};
|
||
|
deviceaction[object.children[i].name] = device;
|
||
|
}
|
||
|
|
||
|
}
|
||
|
zhajioutmodel = newzhaji
|
||
|
scene.add(newzhaji);
|
||
|
}
|
||
|
|
||
|
function zhajicontrol(type,door){
|
||
|
// console.log(door);
|
||
|
// console.log(zhajiin);
|
||
|
let devicenum = door-1;
|
||
|
if(type == "in"){
|
||
|
deviceaction[zhajiin[devicenum].id].action.reset();
|
||
|
deviceaction[zhajiin[devicenum].id].action.time = 0;
|
||
|
deviceaction[zhajiin[devicenum].id].action.timeScale = 1;
|
||
|
deviceaction[zhajiin[devicenum].id].action.play();
|
||
|
}else if(type == "out"){
|
||
|
deviceaction[zhajiout[devicenum].id].action.reset();
|
||
|
deviceaction[zhajiout[devicenum].id].action.time = 0;
|
||
|
deviceaction[zhajiout[devicenum].id].action.timeScale = 1;
|
||
|
deviceaction[zhajiout[devicenum].id].action.play();
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
function monitorrender() {
|
||
|
|
||
|
// updateSize();
|
||
|
|
||
|
for ( var ii = 0; ii < views.length; ++ ii ) {
|
||
|
|
||
|
var view = views[ ii ];
|
||
|
var camera = view.camera;
|
||
|
|
||
|
// view.updateCamera( camera, scene, mouseX, mouseY );
|
||
|
|
||
|
var left = Math.floor( windowWidth * view.left );
|
||
|
var bottom = Math.floor( windowHeight * view.bottom );
|
||
|
var width = Math.floor( windowWidth * view.width );
|
||
|
var height = Math.floor( windowHeight * view.height );
|
||
|
|
||
|
renderer.setViewport( left, bottom, width, height );
|
||
|
renderer.setScissor( left, bottom, width, height );
|
||
|
renderer.setScissorTest( true );
|
||
|
|
||
|
camera.aspect = width / height;
|
||
|
camera.updateProjectionMatrix();
|
||
|
|
||
|
renderer.render( scene, camera );
|
||
|
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
}
|