This commit is contained in:
joylink_cuiweidong 2020-09-22 15:26:00 +08:00
commit 0c81fb8208
6 changed files with 133 additions and 102 deletions

View File

@ -19,6 +19,8 @@ import { PassflowConnect } from '@/jlmap3d/jl3dpassflow/connect/passflowconnect.
import StompClient from '@/utils/sock'; import StompClient from '@/utils/sock';
import store from '@/store/index_APP_TARGET'; import store from '@/store/index_APP_TARGET';
// import { Loading } from 'element-ui'; // import { Loading } from 'element-ui';
import {Stats} from '@/jlmap3d/main/lib/stats.min.js';
let clock = new THREE.Clock(); let clock = new THREE.Clock();
let delta; let delta;
@ -50,7 +52,7 @@ let zhajiout = [];
let deviceaction = []; let deviceaction = [];
let passerwebwork = new Worker("../../static/workertest/passsimulation/passer.js"); // let passerwebwork = new Worker("../../static/workertest/passsimulation/passer.js");
let stationwebwork = new Worker("../../static/workertest/passsimulation/station.js"); let stationwebwork = new Worker("../../static/workertest/passsimulation/station.js");
let stationzon = new ZoneManager(); let stationzon = new ZoneManager();
@ -173,6 +175,10 @@ let views2 = [
]; ];
export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) { export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
// let stats = new Stats();
// dom.appendChild( stats.dom );
let scope = this; let scope = this;
initView(viewMap); initView(viewMap);
this.dom = dom; this.dom = dom;
@ -226,15 +232,15 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
scene = new THREE.Scene(); scene = new THREE.Scene();
scene.background = new THREE.Color(0xa0a0a0); scene.background = new THREE.Color(0xa0a0a0);
let mesh = new THREE.Mesh(new THREE.PlaneBufferGeometry(200, 200), new THREE.MeshPhongMaterial({ color: 0x999999, depthWrite: false })); // let mesh = new THREE.Mesh(new THREE.PlaneBufferGeometry(200, 200), new THREE.MeshPhongMaterial({ color: 0x999999, depthWrite: false }));
mesh.rotation.x = - Math.PI / 2; // mesh.rotation.x = - Math.PI / 2;
mesh.receiveShadow = true; // mesh.receiveShadow = true;
scene.add(mesh); // scene.add(mesh);
//
let grid = new THREE.GridHelper(200, 20, 0x000000, 0x000000); // let grid = new THREE.GridHelper(200, 20, 0x000000, 0x000000);
grid.material.opacity = 0.2; // grid.material.opacity = 0.2;
grid.material.transparent = true; // grid.material.transparent = true;
scene.add(grid); // scene.add(grid);
//定义全局光 //定义全局光
@ -275,7 +281,7 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
let targetPosition = new THREE.Vector3(); let targetPosition = new THREE.Vector3();
let pathfinder = new THREE.Pathfinding(); let pathfinder = new THREE.Pathfinding();
let mouse = new THREE.Vector2(); // let mouse = new THREE.Vector2();
let raycaster = new THREE.Raycaster(); let raycaster = new THREE.Raycaster();
//上车控制开关 //上车控制开关
@ -331,45 +337,45 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
); );
// document.addEventListener( 'mouseup', onDocumentMouseUp, false ); // document.addEventListener( 'mouseup', onDocumentMouseUp, false );
function onDocumentMouseUp (event) { // function onDocumentMouseUp (event) {
//
mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1; // mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1; // mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
//
//
camerass.updateMatrixWorld(); // camerass.updateMatrixWorld();
//
raycaster.setFromCamera( mouse, camerass ); // raycaster.setFromCamera( mouse, camerass );
//
const intersects = raycaster.intersectObject( navmesh ); // const intersects = raycaster.intersectObject( navmesh );
//
if ( !intersects.length ) return; // if ( !intersects.length ) return;
console.log(intersects[0].point); // console.log(intersects[0].point);
targetPosition.copy( intersects[0].point ); // targetPosition.copy( intersects[0].point );
//
// Teleport on ctrl/cmd click or RMB. // // Teleport on ctrl/cmd click or RMB.
if (event.metaKey || event.ctrlKey || event.button === 2) { // if (event.metaKey || event.ctrlKey || event.button === 2) {
//
path = null; // path = null;
originhuman1.position.copy( playerPosition.copy( targetPosition ) ); // originhuman1.position.copy( playerPosition.copy( targetPosition ) );
//
return; // return;
//
} // }
//
path = pathfinder.findPath( playerPosition, targetPosition, ZONE, groupID ); // path = pathfinder.findPath( playerPosition, targetPosition, ZONE, groupID );
//
let points = []; // let points = [];
points.push(new THREE.Vector3(originhuman1.position.x,originhuman1.position.y,originhuman1.position.z)); // points.push(new THREE.Vector3(originhuman1.position.x,originhuman1.position.y,originhuman1.position.z));
for(let i=0;i<path.length;i++){ // for(let i=0;i<path.length;i++){
points.push(path[i]); // points.push(path[i]);
} // }
originhuman1.curve = new THREE.CatmullRomCurve3(points); // originhuman1.curve = new THREE.CatmullRomCurve3(points);
originhuman1.curve.curvrtype = "centripetal"; // originhuman1.curve.curvrtype = "centripetal";
originhuman1.progress = 0; // originhuman1.progress = 0;
console.log(path); // console.log(path);
//
} // }
function tick ( dt ) { function tick ( dt ) {
@ -603,7 +609,7 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
//进站控制 //进站控制
startWorker(); startWorker();
stationwebwork.postMessage("on"); stationwebwork.postMessage("on");
passerwebwork.postMessage("on"); // passerwebwork.postMessage("on");
}; };
},1000); },1000);
@ -767,28 +773,51 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
// // newhumancreate(stationzon.getinitposition("exitgate"),6); // // newhumancreate(stationzon.getinitposition("exitgate"),6);
// } // }
} }
function speciTest(){
// stats.update();
if(aiswitch == 0){
moveanimateupdate();
passerai();
delta = clock.getDelta();
// tick(delta);
for(let i=mixers.length-1;i>=0;i--){
if(mixers[i]._actions[0].isRunning()){
mixers[i].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 );
}
}
}
}
function startWorker(){ function startWorker(){
initpasser(); initpasser();
passerwebwork.onmessage = function (event) { // passerwebwork.onmessage = function (event) {
if(aiswitch == 0){ //
moveanimateupdate(); // stats.update();
passerai(); // if(aiswitch == 0){
// moveanimateupdate();
delta = clock.getDelta(); // passerai();
// tick(delta); //
// delta = clock.getDelta();
for(let i=mixers.length-1;i>=0;i--){ // // 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 );
for(let i=humanlist.children.length-1;i>=0;i--){ // }
if(humanlist.children[i].mixer._actions[0].isRunning()){ // }
humanlist.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 );
} // }
}; // }
// }
// };
stationwebwork.onmessage = function (event) { stationwebwork.onmessage = function (event) {
if(aiswitch == 0){ if(aiswitch == 0){
// console.log(humanlist.children.length); // console.log(humanlist.children.length);
@ -828,13 +857,15 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
// console.log(rendermode); // console.log(rendermode);
if(rendermode == 4){ if(rendermode == 4){
render4view(); render4view();
}else if(rendermode == 2){ }
if(rendermode == 2){
render2view(); render2view();
} }
speciTest();
// else if(rendermode == 1){ // else if(rendermode == 1){
// render4view(); // render4view();
// } // }
else if(rendermode == 0){ if(rendermode == 0){
renderer.render(scene, camerass); renderer.render(scene, camerass);
scope.controls.update(); scope.controls.update();
} }
@ -1046,7 +1077,7 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
model.action.play(); model.action.play();
model.progress = 0; model.progress = 0;
model.runrail = curve; model.runrail = curve;
model.speed = 0.2/curve.getLength(); model.speed = 0.1/curve.getLength();
} }
function moveanimateupdate(){ function moveanimateupdate(){
@ -1614,59 +1645,58 @@ export function Jl3dpassflow(dom,skinCode,routegroup,viewMap) {
} }
let specilView,specilCamera,specilLeft,specilBottom,specilWidth,specilHeight;
function render4view() { function render4view() {
// updateSize(); // updateSize();
for ( let ii = 0; ii < 4; ii ++ ) {
for ( let ii = 0; ii < views4.length; ++ ii ) { specilView = views4[ ii ];
specilCamera = specilView.camera;
let view = views4[ ii ];
let camera = view.camera;
// view.updateCamera( camera, scene, mouseX, mouseY ); // view.updateCamera( camera, scene, mouseX, mouseY );
let left = Math.floor( windowWidth * view.left ); specilLeft = Math.floor( windowWidth * specilView.left );
let bottom = Math.floor( windowHeight * view.bottom ); specilBottom = Math.floor( windowHeight * specilView.bottom );
let width = Math.floor( windowWidth * view.width ); specilWidth = Math.floor( windowWidth * specilView.width );
let height = Math.floor( windowHeight * view.height ); specilHeight = Math.floor( windowHeight * specilView.height );
renderer.setViewport( left, bottom, width, height ); renderer.setViewport( specilLeft,specilBottom,specilWidth,specilHeight );
renderer.setScissor( left, bottom, width, height ); renderer.setScissor( specilLeft,specilBottom,specilWidth,specilHeight );
renderer.setScissorTest( true ); renderer.setScissorTest( true );
camera.aspect = width / height; specilCamera.aspect = specilWidth / specilHeight;
camera.updateProjectionMatrix(); specilCamera.updateProjectionMatrix();
renderer.render( scene, camera ); renderer.render( scene, specilCamera );
} }
} }
function render2view() { function render2view() {
// updateSize(); // updateSize();
for ( let ii = 0; ii < views2.length; ++ ii ) { for ( let ii = 0; ii < 2; ii ++ ) {
let view = views2[ ii ]; specilView = views2[ ii ];
let camera = view.camera; specilCamera = specilView.camera;
// view.updateCamera( camera, scene, mouseX, mouseY ); // view.updateCamera( camera, scene, mouseX, mouseY );
let left = Math.floor( windowWidth * view.left ); specilLeft = Math.floor( windowWidth * specilView.left );
let bottom = Math.floor( windowHeight * view.bottom ); specilBottom = Math.floor( windowHeight * specilView.bottom );
let width = Math.floor( windowWidth * view.width ); specilWidth = Math.floor( windowWidth * specilView.width );
let height = Math.floor( windowHeight * view.height ); specilHeight = Math.floor( windowHeight * specilView.height );
renderer.setViewport( left, bottom, width, height ); renderer.setViewport( specilLeft,specilBottom,specilWidth,specilHeight );
renderer.setScissor( left, bottom, width, height ); renderer.setScissor( specilLeft,specilBottom,specilWidth,specilHeight );
renderer.setScissorTest( true ); renderer.setScissorTest( true );
camera.aspect = width / height; specilCamera.aspect = specilWidth / specilHeight;
camera.updateProjectionMatrix(); specilCamera.updateProjectionMatrix();
renderer.render( scene, camera ); renderer.render( scene, specilCamera );
} }

View File

@ -95,6 +95,7 @@ export default {
watch: { watch: {
'$store.state.app.windowSizeCount': function() { '$store.state.app.windowSizeCount': function() {
this.videoList.forEach((videoPlay, index)=>{ this.videoList.forEach((videoPlay, index)=>{
console.log("??");
document.querySelector('.myvideo' + index + '-dimensions').style.width = window.innerWidth / 4 + 'px'; document.querySelector('.myvideo' + index + '-dimensions').style.width = window.innerWidth / 4 + 'px';
document.querySelector('.myvideo' + index + '-dimensions').style.height = window.innerHeight / 2 + 'px'; document.querySelector('.myvideo' + index + '-dimensions').style.height = window.innerHeight / 2 + 'px';
// videoPlay.width_ = window.innerWidth / 4; // videoPlay.width_ = window.innerWidth / 4;

View File

@ -7,7 +7,7 @@ function timedCount(){
if(e.data == "on"){ if(e.data == "on"){
update = setInterval("passerupdate()", 100); update = setInterval("passerupdate()", 200);
} }
if(e.data == "off"){ if(e.data == "off"){

View File

@ -6,7 +6,7 @@ function timedCount(){
if(e.data == "on"){ if(e.data == "on"){
console.log("on"); // console.log("on");
update = setInterval("stationupdate()", 2000); update = setInterval("stationupdate()", 2000);
} }