1289 lines
49 KiB
HTML
1289 lines
49 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<script src="jquery-2.1.0.min.js"></script>
|
|
<script src="jquery.cookie.js"></script>
|
|
<script type="text/javascript" src="roslib.min.js"></script>
|
|
<script type="text/javascript" src="Lu_Math_Driver.js"></script>
|
|
<!--<script type="text/javascript" src="Lu_Cookie_Driver.js"></script>-->
|
|
<script type="text/javascript" src="Lu_MySQL_Driver_Threejs.js"></script>
|
|
<script src="js/three.js"></script>
|
|
<script src="js/three.js-dev/examples/js/controls/OrbitControls.js"></script>
|
|
<script src="js/three.js-dev/examples/js/libs/stats.min.js"></script>
|
|
<script src="js/three.js-dev/examples/js/libs/dat.gui.min.js"></script>
|
|
<script src="js/three.js-dev/examples/js/loaders/PCDLoader.js"></script>
|
|
<script type="text/javascript" src="paperjs-v0.12.15/docs/assets/js/paper.js"></script>
|
|
<script type="text/javascript" type="text/javascript">
|
|
|
|
var Car_Global_rx=0;
|
|
var Car_Global_ry=0;
|
|
var Car_Global_Theta=0;
|
|
|
|
var Bosch_Msg=new Object();
|
|
var Get_Bosch_Frame_Sch=0;
|
|
var Last_Get_Bosch_Frame_Sch=0;
|
|
|
|
var NAV350_Msg=new Object();
|
|
var Get_NAV350_Frame_Sch=0;
|
|
var Last_Get_NAV350_Frame_Sch=0;
|
|
|
|
var WLR712_Msg=new Object();
|
|
var Get_WLR712_Frame_Sch=0;
|
|
var Last_Get_WLR712_Fraem_Sch=0;
|
|
|
|
|
|
paper.install(window);
|
|
|
|
|
|
var ros = new ROSLIB.Ros({
|
|
url : 'ws://localhost:9190'
|
|
//url : 'ws://localhost:9190'
|
|
});
|
|
//Lu Sync
|
|
|
|
ros.on('connection', function() {
|
|
console.log('Connected to websocket server.');
|
|
});
|
|
|
|
ros.on('error', function(error) {
|
|
console.log('Error connecting to websocket server: ', error);
|
|
});
|
|
|
|
ros.on('close', function() {
|
|
console.log('Connection to websocket server closed.');
|
|
});
|
|
|
|
function listenerBosch(){
|
|
var sub_Bosch_LocalizationVisualization=new ROSLIB.Topic({
|
|
ros : ros,
|
|
name : '/Topic_Bosch_LocalizationVisualization',
|
|
messageType : 'lu_ps20l_msgs/Msg_Bosch_LocalizationVisualization'
|
|
});
|
|
|
|
sub_Bosch_LocalizationVisualization.subscribe(function(message){
|
|
Get_Bosch_Frame_Sch++;
|
|
//console.log(Get_Bosch_Frame_Sch);
|
|
Bosch_Msg.timestamp=message.timestamp;
|
|
Bosch_Msg.uniqueId=message.uniqueId;
|
|
Bosch_Msg.locState=message.locState;
|
|
Bosch_Msg.x=message.x;
|
|
Bosch_Msg.y=message.y;
|
|
Bosch_Msg.yaw=message.yaw;
|
|
Bosch_Msg.delay=message.delay;
|
|
Bosch_Msg.scanlength=message.scanlength;
|
|
//geometry_msgs/Point[] Points
|
|
var Point_Arr=new Array();
|
|
for(let i=0;i<message.Points.length;i++){
|
|
var Bosch_Point=new Object();
|
|
Bosch_Point.x=parseFloat(message.Points[i].x);
|
|
Bosch_Point.y=parseFloat(message.Points[i].y);
|
|
Bosch_Point.z=parseFloat(message.Points[i].z);
|
|
//console.log(Bosch_Point);
|
|
Point_Arr.push(Bosch_Point);
|
|
}
|
|
Bosch_Msg.Point_Arr=Point_Arr;
|
|
sub_Bosch_LocalizationVisualization.unsubscribe();
|
|
});
|
|
}
|
|
function listenerNAV350(){
|
|
var sub_NAV350_LocalizationVisualization=new ROSLIB.Topic({
|
|
ros : ros,
|
|
name : '/Topic_NAV350_LocalizationVisualization',
|
|
messageType : 'lu_ps20l_msgs/Msg_NAV350_LocalizationVisualization'
|
|
});
|
|
|
|
sub_NAV350_LocalizationVisualization.subscribe(function(message){
|
|
//console.log(message);
|
|
Get_NAV350_Frame_Sch++;
|
|
NAV350_Msg.NavMode=message.NavMode;
|
|
NAV350_Msg.rx_m=message.rx_m;
|
|
NAV350_Msg.ry_m=message.ry_m;
|
|
NAV350_Msg.rt_deg=message.rt_deg;
|
|
NAV350_Msg.MeanDeviation_m=message.MeanDeviation_m;
|
|
var ori_rx=NAV350_Msg.rx_m;
|
|
var ori_ry=NAV350_Msg.ry_m;
|
|
var ori_rt=NAV350_Msg.rt_deg;
|
|
|
|
var Reflector_Arr=new Array();
|
|
for(let i=0;i<message.Reflectors;i++){
|
|
var Reflector=new Object();
|
|
var ReflectGlobalPosition=new Object();
|
|
ReflectGlobalPosition=Lu_ORILocalPoint2GlobalPoint(message.rx_m,message.ry_m,message.rt_deg,message.Cartx[i],message.Carty[i]);
|
|
//console.log(ReflectGlobalPosition);
|
|
Reflector.ReflectGlobalPosition=ReflectGlobalPosition;
|
|
Reflector.LocalID=message.LocalID[i];
|
|
Reflector.GlobalID=message.GlobalID[i];
|
|
Reflector.LandmarkType=parseInt(message.LandmarkType[i],10);
|
|
Reflector.ReflectorType=parseInt(message.ReflectorType[i],10);
|
|
Reflector.Quality=message.Quality[i];
|
|
Reflector.ReflectorTimestamp=message.ReflectorTimestamp[i];
|
|
Reflector.ReflectorSize=message.ReflectorSize[i];
|
|
Reflector.ReflectorsHitCount=message.ReflectorsHitCount[i];
|
|
Reflector.ReflectorMeanEcho=message.ReflectorMeanEcho[i];
|
|
Reflector_Arr.push(Reflector);
|
|
}
|
|
|
|
var Dist_Rssi_Point_Arr=new Array();
|
|
for(let i=0;i<message.distdatanum;i++){
|
|
var DRP=new Object();
|
|
DRP.Dist_m=parseFloat(message.dists_m[i]);
|
|
DRP.Angle_deg=parseFloat(message.angle_deg[i]);
|
|
DRP.RSSI=parseFloat(message.rssi[i]);
|
|
|
|
var dist=DRP.Dist_m;
|
|
var angle=DRP.Angle_deg;
|
|
DRP.GlobalPosition = Lu_DRPLocalPoint2GlobalPoint(ori_rx,ori_ry,ori_rt,dist,angle);
|
|
Dist_Rssi_Point_Arr.push(DRP);
|
|
}
|
|
|
|
NAV350_Msg.Reflector_Arr=Reflector_Arr;
|
|
NAV350_Msg.Dist_Rssi_Point_Arr=Dist_Rssi_Point_Arr;
|
|
//console.log(NAV350_Msg);
|
|
sub_NAV350_LocalizationVisualization.unsubscribe();
|
|
});
|
|
}
|
|
function listenerWLR712(){
|
|
var sub_WLR712_LocalizationVisualization=new ROSLIB.Topic({
|
|
ros: ros,
|
|
name : '/Topic_WLR712_LocalizationVisualization',
|
|
messageType : 'lu_ps20l_msgs/Msg_WLR712_LocalizationVisualization'
|
|
});
|
|
|
|
sub_WLR712_LocalizationVisualization.subscribe(function(message){
|
|
//console.log(message);
|
|
Get_WLR712_Frame_Sch++;
|
|
WLR712_Msg.NavState=message.NavState;
|
|
WLR712_Msg.rx_m=message.rx_m;
|
|
WLR712_Msg.ry_m=message.ry_m;
|
|
WLR712_Msg.rt_deg=message.rt_deg;
|
|
//WLR712_Msg.MeanDeviation_m=message.MeanDeviation_m;
|
|
var ori_rx=WLR712_Msg.rx_m;
|
|
var ori_ry=WLR712_Msg.ry_m;
|
|
var ori_rt=WLR712_Msg.rt_deg;
|
|
|
|
var Reflector_Arr=new Array();
|
|
for(let i=0;i<message.Reflectors;i++){
|
|
var Reflector=new Object();
|
|
var ReflectGlobalPosition=new Object();
|
|
ReflectGlobalPosition.x=message.Cartx_m[i];
|
|
ReflectGlobalPosition.y=message.Carty_m[i];
|
|
//ReflectGlobalPosition=Lu_ORILocalPoint2GlobalPoint(message.rx_m,message.ry_m,message.rt_deg,message.Cartx_m[i],message.Carty_m[i]);
|
|
//console.log(ReflectGlobalPosition);
|
|
Reflector.ReflectGlobalPosition=ReflectGlobalPosition;
|
|
//Reflector.LocalID=message.LocalID[i];
|
|
Reflector.GlobalID=message.GlobalID[i];
|
|
Reflector.LandmarkType=parseInt(message.LandmarkType[i],10);
|
|
Reflector.ReflectorType=parseInt(message.ReflectorType[i],10);
|
|
//Reflector.Quality=message.Quality[i];
|
|
//Reflector.ReflectorTimestamp=message.ReflectorTimestamp[i];
|
|
Reflector.ReflectorSize=message.ReflectorSize_m[i]*1000;
|
|
Reflector.ReflectorsHitCount=message.ReflectorsHitCount[i];
|
|
Reflector.ReflectorMeanEcho=message.ReflectorMeanEcho[i];
|
|
Reflector_Arr.push(Reflector);
|
|
}
|
|
|
|
var Dist_Rssi_Point_Arr=new Array();
|
|
for(let i=0;i<message.distdatanum;i++){
|
|
var DRP=new Object();
|
|
DRP.Dist_m=parseFloat(message.dists_m[i]);
|
|
DRP.Angle_deg=i*360.0/7200.0;//parseFloat(message.angle_deg[i]);
|
|
DRP.RSSI=parseFloat(message.rssi[i]);
|
|
|
|
var dist=DRP.Dist_m;
|
|
var angle=DRP.Angle_deg;
|
|
DRP.GlobalPosition = Lu_DRPLocalPoint2GlobalPoint(ori_rx,ori_ry,ori_rt,dist,angle);
|
|
Dist_Rssi_Point_Arr.push(DRP);
|
|
}
|
|
|
|
WLR712_Msg.Reflector_Arr=Reflector_Arr;
|
|
WLR712_Msg.Dist_Rssi_Point_Arr=Dist_Rssi_Point_Arr;
|
|
//console.log(WLR712_Msg);
|
|
sub_WLR712_LocalizationVisualization.unsubscribe();
|
|
});
|
|
}
|
|
|
|
function client_request(str){
|
|
$('#output').html("");
|
|
window.parent.postMessage(
|
|
{
|
|
event_id: 'client_request',
|
|
data: {
|
|
v1: str
|
|
}
|
|
},
|
|
"*" //or "www.parentpage.com"
|
|
);
|
|
}
|
|
|
|
function receiveMessage(event){
|
|
//console.log(event.data);
|
|
switch(event.data.event_id){
|
|
case "client_response":{
|
|
var data=event.data.data;
|
|
var result=data.v1;
|
|
var ROS_String_Output=data.v2;
|
|
var Rec_HMI_String_Input=data.v3;
|
|
var Client_Request_Cmd=Rec_HMI_String_Input.split(':');
|
|
//console.log(data);
|
|
switch(Client_Request_Cmd[0]){
|
|
case "GetPathTable":{
|
|
Lu_Parse_PathTable(ROS_String_Output);
|
|
Get_PathTable_File_OK=true;
|
|
//console.log(PathTable_Line_Arr);
|
|
//document.getElementById('output').innerText=ROS_String_Output;
|
|
}
|
|
break;
|
|
case "GetNodePointManagerTable":{
|
|
//console.log("GetNodePointManagerTable"+ROS_String_Output);
|
|
Lu_Parse_NodePointManagerTable(ROS_String_Output);
|
|
//console.log(NodePointManagerTable_PathNode_Arr);
|
|
//document.getElementById('output').innerText=ROS_String_Output;
|
|
Get_NodePointManagerTable_File_OK=true;
|
|
}
|
|
break;
|
|
case "GetStationFloorIndexTable": {
|
|
//console.log("GetStationFloorIndexTable"+ROS_String_Output);
|
|
Lu_Parse_StationFloorIndexTable(ROS_String_Output);
|
|
Lu_Create_NodePoint_Map_With_Name();
|
|
Get_StationFloorIndexTable_File_OK=true;
|
|
}
|
|
break;
|
|
case "GetPointCloudTable":{
|
|
Lu_Parse_PointCloudTable(ROS_String_Output);
|
|
|
|
Get_PointCloudTable_File_OK=true;
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
|
|
window.addEventListener("message", receiveMessage, false);
|
|
|
|
function client(str){
|
|
$('#output').html("");
|
|
var client_HMIString=new ROSLIB.Service({
|
|
ros:ros,
|
|
name:'/Service_HMIString',
|
|
serviceType:'lu_ps20l_msgs/Srv_HMIString'
|
|
});
|
|
|
|
var request = new ROSLIB.ServiceRequest({
|
|
HMI_String_Input:str
|
|
});
|
|
client_HMIString.callService(request,function(result) {
|
|
});
|
|
}
|
|
|
|
var Get_PathTable_File_OK=false;
|
|
var Get_NodePointManagerTable_File_OK=false;
|
|
var Get_StationFloorIndexTable_File_OK=false;
|
|
//client_request("GetPathTable");
|
|
//client_request("GetNodePointManagerTable");
|
|
|
|
|
|
</script>
|
|
<title>Title</title>
|
|
<style type="text/css">
|
|
html, body {
|
|
font-family: Calibri, sans-serif;
|
|
font-size: 36px;
|
|
height: 100%;
|
|
margin: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
canvas {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
.threejs-btn-wrapper {
|
|
position: absolute;
|
|
}
|
|
|
|
.threejs-btn-group {
|
|
margin: 1em;
|
|
width: 1.5em;
|
|
}
|
|
|
|
.threejs-btn {
|
|
background: #fff;
|
|
border: thin solid #aaa;
|
|
border-radius: 0.25em;
|
|
color: #555;
|
|
cursor: pointer;
|
|
font-size: inherit;
|
|
height: 1.5em;
|
|
margin: 1em 0 0 1em;
|
|
min-width: 1.5em;
|
|
padding: 0 0.4em;;
|
|
}
|
|
|
|
.threejs-btn svg {
|
|
fill: #555;
|
|
margin-top: 0.1em;
|
|
}
|
|
|
|
.threejs-btn:hover {
|
|
border-color: #777;
|
|
box-shadow: 0.03em 0.05em 0.1em rgba(0,0,0,.2);
|
|
color: #000;
|
|
}
|
|
|
|
.threejs-btn:active {
|
|
background: #ddd;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.threejs-btn:hover svg {
|
|
fill: #000;
|
|
}
|
|
|
|
.threejs-btn:focus {
|
|
outline: thin dotted;
|
|
outline-offset: -0.2em;
|
|
}
|
|
|
|
.threejs-btn.disabled {
|
|
background: #bababa;
|
|
color: #888;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.threejs-btn.disabled svg {
|
|
fill: #888;
|
|
}
|
|
|
|
.threejs-btn-group button {
|
|
margin: 0;
|
|
}
|
|
|
|
.threejs-btn-group .threejs-btn:last-of-type {
|
|
border-radius: 0 0 0.25em 0.25em;
|
|
}
|
|
|
|
.threejs-btn-group .threejs-btn:first-of-type {
|
|
border-radius: 0.25em 0.25em 0 0;
|
|
}
|
|
|
|
#threejs-rotate-y-icon {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
button[id^="threejs-rotate"] {
|
|
padding: 0.1em 0.2em;
|
|
}
|
|
|
|
.threejs-btn-group.threejs-btn-group-directional {
|
|
align-items: center;
|
|
display: flex;
|
|
left: 2.75em;
|
|
position: absolute;
|
|
top: 2.5em;
|
|
width: 5em;
|
|
}
|
|
|
|
.threejs-btn-group.threejs-btn-group-directional .threejs-btn {
|
|
border-radius: 0.25em;
|
|
margin: 0.1em;
|
|
padding: 0.05em 0.15em;
|
|
}
|
|
|
|
#threejs-down svg {
|
|
transform: rotate(90deg);
|
|
}
|
|
|
|
#threejs-up svg {
|
|
transform: rotate(-90deg);
|
|
}
|
|
|
|
#threejs-left svg {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.threejs-help-overlay {
|
|
align-items: center;
|
|
background: rgba(0,0,0,.75);
|
|
display: flex;
|
|
height: 100%;
|
|
justify-content: space-around;
|
|
position: absolute;
|
|
width: 100%;
|
|
z-index: 10;
|
|
}
|
|
|
|
.threejs-help-overlay.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.threejs-help-overlay-close {
|
|
color: #fff;
|
|
cursor: pointer;
|
|
position: absolute;
|
|
right: 1.25em;
|
|
top: 1em;
|
|
}
|
|
|
|
.threejs-help-overlay p {
|
|
color: #fff;
|
|
font-weight: normal;
|
|
text-align: center;
|
|
padding: 0 .75em;
|
|
font-size: 0.8em;
|
|
line-height: 1.1;
|
|
}
|
|
|
|
.threejs-help-overlay b {
|
|
font-size: 1.25em;
|
|
line-height: 1.4;
|
|
}
|
|
/*
|
|
canvas {
|
|
display: block;
|
|
}
|
|
*/
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="threejs-btn-wrapper">
|
|
<button id="threejs-reset" class="threejs-btn">Reset</button>
|
|
<div class="threejs-btn-group">
|
|
<button id="threejs-zoom-in" class="threejs-btn">+</button>
|
|
<button id="threejs-zoom-out" class="threejs-btn">-</button>
|
|
</div>
|
|
|
|
<div class="threejs-btn-group threejs-btn-group-directional">
|
|
<button id="threejs-left" class="threejs-btn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" x+"0px" y="0px" viewBox="0 0 75 75">
|
|
<path d="M61.277 34.077L42.893 15.693c-1.995-1.994-5.228-1.994-7.222 0-1.993 1.995-1.993 5.228 0 7.222l9.667 9.666H16.785c-2.793 0-5.058 2.288-5.058 5.108s2.264 5.107 5.058 5.107h28.55l-9.664 9.666c-1.993 1.996-1.993 5.23 0 7.223.998.997 2.304 1.496 3.612 1.496 1.307 0 2.614-.5 3.61-1.497L61.276 41.3c.958-.958 1.496-2.257 1.496-3.61 0-1.356-.538-2.655-1.495-3.613z"/>
|
|
</svg>
|
|
</button>
|
|
<div class="threejs-up-down-wrapper">
|
|
<button id="threejs-up" class="threejs-btn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" x+"0px" y="0px" viewBox="0 0 75 75">
|
|
<path d="M61.277 34.077L42.893 15.693c-1.995-1.994-5.228-1.994-7.222 0-1.993 1.995-1.993 5.228 0 7.222l9.667 9.666H16.785c-2.793 0-5.058 2.288-5.058 5.108s2.264 5.107 5.058 5.107h28.55l-9.664 9.666c-1.993 1.996-1.993 5.23 0 7.223.998.997 2.304 1.496 3.612 1.496 1.307 0 2.614-.5 3.61-1.497L61.276 41.3c.958-.958 1.496-2.257 1.496-3.61 0-1.356-.538-2.655-1.495-3.613z"/>
|
|
</svg>
|
|
</button>
|
|
<button id="threejs-down" class="threejs-btn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" x+"0px" y="0px" viewBox="0 0 75 75">
|
|
<path d="M61.277 34.077L42.893 15.693c-1.995-1.994-5.228-1.994-7.222 0-1.993 1.995-1.993 5.228 0 7.222l9.667 9.666H16.785c-2.793 0-5.058 2.288-5.058 5.108s2.264 5.107 5.058 5.107h28.55l-9.664 9.666c-1.993 1.996-1.993 5.23 0 7.223.998.997 2.304 1.496 3.612 1.496 1.307 0 2.614-.5 3.61-1.497L61.276 41.3c.958-.958 1.496-2.257 1.496-3.61 0-1.356-.538-2.655-1.495-3.613z"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<button id="threejs-right" class="threejs-btn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" x+"0px" y="0px" viewBox="0 0 75 75">
|
|
<path d="M61.277 34.077L42.893 15.693c-1.995-1.994-5.228-1.994-7.222 0-1.993 1.995-1.993 5.228 0 7.222l9.667 9.666H16.785c-2.793 0-5.058 2.288-5.058 5.108s2.264 5.107 5.058 5.107h28.55l-9.664 9.666c-1.993 1.996-1.993 5.23 0 7.223.998.997 2.304 1.496 3.612 1.496 1.307 0 2.614-.5 3.61-1.497L61.276 41.3c.958-.958 1.496-2.257 1.496-3.61 0-1.356-.538-2.655-1.495-3.613z"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div id="threejs-content"></div>
|
|
<script>
|
|
|
|
|
|
//https://threejs.org/docs/#examples/en/loaders/PCDLoader
|
|
var scene = new THREE.Scene();
|
|
// instantiate a loader
|
|
const loader = new THREE.PCDLoader();
|
|
|
|
// load a resource
|
|
loader.load(
|
|
// resource URL
|
|
'/var/www/html/a.pcd',
|
|
// called when the resource is loaded
|
|
function ( mesh ) {
|
|
//mesh.material.Color.setRGB(1, 0, 0);
|
|
mesh.material.color.setRGB(1, 1, 1);
|
|
|
|
scene.add( mesh );
|
|
render();
|
|
},
|
|
// 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' );
|
|
|
|
}
|
|
);
|
|
|
|
function Lu_Draw_Text_Fast(Position,str,color){
|
|
let canvas = document.createElement("canvas");
|
|
canvas.width =500;
|
|
canvas.height = 150;
|
|
let ctx = canvas.getContext("2d");
|
|
ctx.fillStyle = color;//"#ffff00";
|
|
ctx.font = "Bold 100px 宋体";
|
|
ctx.lineWidth = 4;
|
|
ctx.fillText(str,4,90);
|
|
let texture = new THREE.Texture(canvas);
|
|
texture.needsUpdate = true;
|
|
let material = new THREE.SpriteMaterial({map:texture});
|
|
let text = new THREE.Sprite(material);
|
|
text.scale.set(0.5 * 5, 0.25 * 5, 0.75 * 5);
|
|
text.position.set(Position.x,Position.y,0);
|
|
scene.add(text);
|
|
}
|
|
|
|
|
|
function Lu_Draw_Text(Position,text,color){
|
|
var textLoad = new THREE.FontLoader().load('js/three.js-dev/examples/fonts/gentilis_regular.typeface.json',function(font){
|
|
//var textLoad = new THREE.FontLoader().load('js/three.js-dev/examples/fonts/SimHei_Regular.json',function(font){
|
|
var txtGeo = new THREE.TextGeometry(text,{
|
|
font: font,
|
|
size: 0.5,
|
|
height: 0.01,
|
|
curveSegments: 12,
|
|
bevelEnabled: true,
|
|
bevelThickness: 0.0,
|
|
bevelSize: 0.0,
|
|
bevelSegments: 3
|
|
});
|
|
var txtMater = new THREE.MeshBasicMaterial({color: color});
|
|
var txtMesh = new THREE.Mesh(txtGeo,txtMater);
|
|
txtMesh.position.set(Position.x+0.05,Position.y-0.05,0);
|
|
scene.add(txtMesh);
|
|
});
|
|
}
|
|
|
|
//draw line
|
|
function Lu_Draw_Line(P1,P2,color){
|
|
const material = new THREE.LineBasicMaterial( { color: color } );
|
|
const points = [];
|
|
points.push(P1);
|
|
points.push(P2);
|
|
const geometry = new THREE.BufferGeometry().setFromPoints( points );
|
|
const line = new THREE.Line( geometry, material);
|
|
scene.add( line);
|
|
return line;
|
|
}
|
|
function Lu_Draw_Arc(CP,Radius,StartAngle,EndAngle,ClockWiseDir,color){
|
|
|
|
var ClockWiseDirFlag=false;
|
|
if(ClockWiseDir==0)ClockWiseDirFlag=false;
|
|
else ClockWiseDirFlag=true;
|
|
|
|
const curve = new THREE.EllipseCurve(
|
|
CP.x, CP.y, // ax, aY
|
|
Radius, Radius, // xRadius, yRadius
|
|
StartAngle*Math.PI/180.0, EndAngle*Math.PI/180.0, // aStartAngle, aEndAngle
|
|
ClockWiseDirFlag, // aClockwise
|
|
0 // aRotation
|
|
);
|
|
|
|
const points = curve.getPoints( 50 );
|
|
const geometry = new THREE.BufferGeometry().setFromPoints( points );
|
|
|
|
const material = new THREE.LineBasicMaterial( { color : color } );
|
|
|
|
// Create the final object to add to the scene
|
|
const ellipse = new THREE.Line( geometry, material );
|
|
scene.add(ellipse);
|
|
}
|
|
|
|
function Lu_Draw_Circle(CP,Radius,color){
|
|
const curve = new THREE.EllipseCurve(
|
|
CP.x, CP.y, // ax, aY
|
|
Radius, Radius, // xRadius, yRadius
|
|
0, 2*Math.PI, // aStartAngle, aEndAngle
|
|
false, // aClockwise
|
|
0 // aRotation
|
|
);
|
|
|
|
const points = curve.getPoints( 50 );
|
|
const geometry = new THREE.BufferGeometry().setFromPoints( points );
|
|
|
|
const material = new THREE.LineBasicMaterial( { color : color } );
|
|
|
|
// Create the final object to add to the scene
|
|
const ellipse = new THREE.Line( geometry, material );
|
|
scene.add(ellipse);
|
|
}
|
|
|
|
function Lu_Set_LandMarker(LandMarker,x, y, z,visible,red,green,blue){
|
|
LandMarker.Circle.position.copy(new THREE.Vector3(x, y, z));
|
|
LandMarker.Line1.position.copy(new THREE.Vector3(x, y, z));
|
|
LandMarker.Line2.position.copy(new THREE.Vector3(x, y, z));
|
|
LandMarker.Circle.material.color.setRGB(red,green,blue);
|
|
LandMarker.Line1.material.color.setRGB(red,green,blue);
|
|
LandMarker.Line2.material.color.setRGB(red,green,blue);
|
|
LandMarker.Circle.visible=visible;
|
|
LandMarker.Line1.visible=visible;
|
|
LandMarker.Line2.visible=visible;
|
|
}
|
|
function Lu_Draw_LandMarker(CP,d,color){
|
|
var Radius=d/500;
|
|
const curve = new THREE.EllipseCurve(
|
|
CP.x, CP.y, // ax, aY
|
|
Radius, Radius, // xRadius, yRadius
|
|
0, 2*Math.PI, // aStartAngle, aEndAngle
|
|
false, // aClockwise
|
|
0 // aRotation
|
|
);
|
|
|
|
const points = curve.getPoints( 50 );
|
|
const geometry = new THREE.BufferGeometry().setFromPoints( points );
|
|
|
|
const material = new THREE.LineBasicMaterial( { color : color } );
|
|
|
|
// Create the final object to add to the scene
|
|
const ellipse = new THREE.Line( geometry, material );
|
|
scene.add(ellipse);
|
|
|
|
var P_Left=new THREE.Vector3(CP.x-Radius-0.1, CP.y, 0.2);
|
|
var P_Right=new THREE.Vector3(CP.x+Radius+0.1, CP.y, 0.2);
|
|
var P_Up=new THREE.Vector3(CP.x,CP.y+Radius+0.1,0.2);
|
|
var P_Down=new THREE.Vector3(CP.x,CP.y-Radius-0.1,0.2);
|
|
var line1=Lu_Draw_Line(P_Left,P_Right,color);
|
|
var line2=Lu_Draw_Line(P_Up,P_Down,color);
|
|
var LandMarker=new Object();
|
|
LandMarker.Circle=ellipse;
|
|
LandMarker.Line1=line1;
|
|
LandMarker.Line2=line2;
|
|
return LandMarker;
|
|
}
|
|
|
|
function Lu_Draw_WayPoint(WayPoint_Line_List,color){
|
|
for(let i=0;i<WayPoint_Line_List.length;i++){
|
|
var Line=WayPoint_Line_List[i];
|
|
Lu_Draw_Line(Line.startpoint,Line.endpoint,color);
|
|
}
|
|
}
|
|
|
|
function Lu_Draw_Bezier(Bezier_Line_List,color){
|
|
for(let i=0;i<Bezier_Line_List.length;i++){
|
|
var Line=Bezier_Line_List[i];
|
|
Lu_Draw_Line(Line.startpoint,Line.endpoint,color);
|
|
}
|
|
}
|
|
|
|
function Lu_Draw_OriginTurn(CP,FromPoint,ToPoint,Radius,StartAngle,EndAngle,ClockWiseDir,color){
|
|
Lu_Draw_Arc(CP,Radius,StartAngle,EndAngle,ClockWiseDir,color);
|
|
Lu_Draw_Line(CP,FromPoint,color);
|
|
Lu_Draw_Line(CP,ToPoint,color);
|
|
}
|
|
|
|
function Lu_Draw_PathNode(PathNode,color1,color2_str){
|
|
var CP=new Object();
|
|
CP.x=PathNode.Node_x;
|
|
CP.y=PathNode.Node_y;
|
|
Lu_Draw_Circle(CP,0.2,color1);
|
|
|
|
var Heading=Lu_GetNextPoint_By_xs_ys_dirdeg(PathNode.Node_x,PathNode.Node_y,PathNode.Node_thetax+90,0.5);
|
|
Lu_Draw_Line(CP,Heading,color1);
|
|
//console.log(PathNode.NodeID);
|
|
var text1=PathNode.NodeID.toString();
|
|
var text2=PathNode.NodeName.toString();
|
|
//Lu_Draw_Text(Heading,text1,color2);
|
|
var text=text1;
|
|
if(text2!="")text=text1+":"+text2;
|
|
Lu_Draw_Text_Fast(Heading,text,color2_str);
|
|
}
|
|
function Lu_Draw_OriginCoordinate() {
|
|
var X_P=new Object();
|
|
X_P.x=5;
|
|
X_P.y=0;
|
|
|
|
var Y_P=new Object();
|
|
Y_P.x=0;
|
|
Y_P.y=5;
|
|
|
|
Lu_Draw_Line(new THREE.Vector3(0, 0, 0), new THREE.Vector3(X_P.x, X_P.y, 0), 0x00ff00);
|
|
Lu_Draw_Line(new THREE.Vector3(0, 0, 0), new THREE.Vector3(Y_P.x, Y_P.y, 0), 0xff0000);
|
|
Lu_Draw_Line(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, 5), 0x0000ff);
|
|
|
|
Lu_Draw_Text(X_P,"X",0x00ff00);
|
|
Lu_Draw_Text(Y_P,"Y",0xff0000);
|
|
}
|
|
|
|
function Lu_Draw_Car(x,y,t,color){
|
|
const curve = new THREE.EllipseCurve(
|
|
x, y, // ax, aY
|
|
0.5, 0.5, // xRadius, yRadius
|
|
0, 2*Math.PI, // aStartAngle, aEndAngle
|
|
false, // aClockwise
|
|
0 // aRotation
|
|
);
|
|
|
|
const points = curve.getPoints( 50 );
|
|
const geometry = new THREE.BufferGeometry().setFromPoints( points );
|
|
|
|
const material = new THREE.LineBasicMaterial( { color : color } );
|
|
|
|
// Create the final object to add to the scene
|
|
const ellipse = new THREE.Line( geometry, material );
|
|
scene.add(ellipse);
|
|
|
|
|
|
var Heading=Lu_GetNextPoint_By_xs_ys_dirdeg(x,y,t+90,1.0);
|
|
|
|
const points_l = [];
|
|
points_l.push(new THREE.Vector3(x,y,0.2));
|
|
points_l.push(new THREE.Vector3(Heading.x,Heading.y,0.2));
|
|
const geometry_l = new THREE.BufferGeometry().setFromPoints( points_l );
|
|
const line = new THREE.Line( geometry_l, material);
|
|
scene.add(line);
|
|
|
|
var car=new Object();
|
|
car.circle=ellipse;
|
|
car.line=line;
|
|
return car;
|
|
}
|
|
function Lu_Draw_Bosch_Message_Init(){
|
|
var BoschPointNum=2000;
|
|
|
|
var Sprite_Arr=new Array();
|
|
|
|
|
|
for(let i=0;i<BoschPointNum;i++){
|
|
var material = new THREE.SpriteMaterial( { color : 0xFF0000 } );
|
|
|
|
var particle = new THREE.Sprite(material);
|
|
particle.position.x=0;
|
|
particle.position.y=0;
|
|
particle.position.z=0;
|
|
particle.scale.x = particle.scale.y = 0.05;
|
|
scene.add(particle);
|
|
Sprite_Arr.push(particle);
|
|
}
|
|
var Bosch=new Object();
|
|
Bosch.Sprite_Arr=Sprite_Arr;
|
|
return Bosch;
|
|
}
|
|
|
|
function Lu_Draw_NAV350_Message_Init(){
|
|
/*
|
|
var NAV350PointNum=1440;
|
|
var Sprite_Arr=new Array();
|
|
var material = new THREE.SpriteMaterial( { color : 0xFF0000 } );
|
|
for(let i=0;i<NAV350PointNum;i++){
|
|
var sprite = new THREE.Sprite(material);
|
|
sprite.position.set(0.0, 0.0, 0.0);
|
|
sprite.scale.set(0.05, 0.05, 0.05);
|
|
scene.add(sprite);
|
|
Sprite_Arr.push(sprite);
|
|
}
|
|
var nav350=new Object();
|
|
nav350.Sprite_Arr=Sprite_Arr;
|
|
return nav350;
|
|
*/
|
|
|
|
//var LandMarker=new Object();
|
|
//LandMarker.x=5;
|
|
//LandMarker.y=0;
|
|
//Lu_Draw_LandMarker(LandMarker,110,0xff2f00);
|
|
|
|
|
|
var NAV350LandMarkerNum=40;
|
|
var LandMarker_Arr=new Array();
|
|
for(let i=0;i<NAV350LandMarkerNum;i++){
|
|
var LandMarker=Lu_Draw_LandMarker(new THREE.Vector3(0,0,0),110,0xffffff);
|
|
Lu_Set_LandMarker(LandMarker,0, 0, 0,false,0,0,0);
|
|
LandMarker_Arr.push(LandMarker);
|
|
}
|
|
|
|
var NAV350PointNum=1440;
|
|
|
|
var Sprite_Arr=new Array();
|
|
|
|
|
|
for(let i=0;i<NAV350PointNum;i++){
|
|
var material = new THREE.SpriteMaterial( { color : 0xFF0000 } );
|
|
|
|
var particle = new THREE.Sprite(material);
|
|
particle.position.x=0;
|
|
particle.position.y=0;
|
|
particle.position.z=0;
|
|
particle.scale.x = particle.scale.y = 0.05;
|
|
scene.add(particle);
|
|
Sprite_Arr.push(particle);
|
|
}
|
|
var nav350=new Object();
|
|
nav350.Sprite_Arr=Sprite_Arr;
|
|
nav350.LandMarker_Arr=LandMarker_Arr;
|
|
return nav350;
|
|
/*
|
|
var NAV350PointNum=1440;
|
|
var Particle_Arr=new Array(NAV350PointNum);
|
|
var material =new THREE.ParticleBasicMaterial( { color : 0xFF0000 });
|
|
var range = 500;
|
|
for(var i = 0; i < NAV350PointNum; i++)
|
|
{
|
|
var particle = new THREE.Particle(material);
|
|
particle.position = new THREE.Vector3(
|
|
Math.random() * range - range / 2,
|
|
Math.random() * range - range / 2,
|
|
Math.random() * range - range / 2
|
|
);
|
|
particle.scale = 0.1;
|
|
|
|
//particle.rotation.z = Math.PI;
|
|
scene.add(particle);
|
|
Particle_Arr.push(particle);
|
|
|
|
var nav350=new Object();
|
|
nav350.Particle_Arr=Particle_Arr;
|
|
return nav350;
|
|
|
|
}*/
|
|
}
|
|
|
|
function Lu_Draw_WLR712_Message_Init(){
|
|
var WLR712LandMarkerNum=40;
|
|
var LandMarker_Arr=new Array();
|
|
for(let i=0;i<WLR712LandMarkerNum;i++){
|
|
var LandMarker=Lu_Draw_LandMarker(new THREE.Vector3(0,0,0),110,0xffffff);
|
|
Lu_Set_LandMarker(LandMarker,0, 0, 0,false,0,0,0);
|
|
LandMarker_Arr.push(LandMarker);
|
|
}
|
|
|
|
var WLR712PointNum=7200;//1440;
|
|
|
|
var Sprite_Arr=new Array();
|
|
|
|
|
|
for(let i=0;i<WLR712PointNum;i++){
|
|
var material = new THREE.SpriteMaterial( { color : 0xFF0000 } );
|
|
|
|
var particle = new THREE.Sprite(material);
|
|
particle.position.x=0;
|
|
particle.position.y=0;
|
|
particle.position.z=0;
|
|
particle.scale.x = particle.scale.y = 0.05;
|
|
scene.add(particle);
|
|
Sprite_Arr.push(particle);
|
|
}
|
|
var WLR712=new Object();
|
|
WLR712.Sprite_Arr=Sprite_Arr;
|
|
WLR712.LandMarker_Arr=LandMarker_Arr;
|
|
return WLR712;
|
|
}
|
|
|
|
var Car=Lu_Draw_Car(Car_Global_rx,Car_Global_ry,Car_Global_Theta,0xFF0000);
|
|
var Bosch = Lu_Draw_Bosch_Message_Init();
|
|
var NAV350 = Lu_Draw_NAV350_Message_Init();
|
|
var WLR712 = Lu_Draw_WLR712_Message_Init();
|
|
var draw_sch=0;
|
|
var period_times=0;
|
|
function Timer(){
|
|
listenerBosch();
|
|
listenerNAV350();
|
|
listenerWLR712();
|
|
period_times=period_times+1;
|
|
Car_Global_rx=parseFloat($.cookie('Car_Global_rx'));
|
|
Car_Global_ry=parseFloat($.cookie('Car_Global_ry'));
|
|
Car_Global_Theta=parseFloat($.cookie('Car_Global_Theta'));
|
|
|
|
|
|
//console.log(Car_Global_rx.toFixed(3)+" "+Car_Global_ry.toFixed(3)+" "+Car_Global_Theta.toFixed(3));
|
|
if(draw_sch==0){
|
|
client_request("GetPathTable");
|
|
draw_sch=1;
|
|
}
|
|
else if(draw_sch==1){
|
|
client_request("GetNodePointManagerTable");
|
|
draw_sch=2;
|
|
}
|
|
else if(draw_sch==2){
|
|
client_request("GetStationFloorIndexTable");
|
|
draw_sch=3;
|
|
}
|
|
|
|
if(draw_sch==3) {
|
|
if (Get_NodePointManagerTable_File_OK && Get_PathTable_File_OK && Get_StationFloorIndexTable_File_OK) {
|
|
Lu_Draw_OriginCoordinate();
|
|
draw_sch = 4;
|
|
}
|
|
}
|
|
else if(draw_sch==4){
|
|
for(let j=0;j<PathTable_Line_Arr.length;j++){
|
|
var PathTable_Line=PathTable_Line_Arr[j];
|
|
Lu_Draw_Line(new THREE.Vector3( PathTable_Line.start_point.x, PathTable_Line.start_point.y, 0 ),new THREE.Vector3( PathTable_Line.end_point.x, PathTable_Line.end_point.y, 0, 0 ),0x0000ff);
|
|
}
|
|
|
|
for(let k=0;k<PathTable_Arc_Arr.length;k++){
|
|
var PathTable_Arc=PathTable_Arc_Arr[k];
|
|
Lu_Draw_Arc(PathTable_Arc.centerpoint,PathTable_Arc.radius,PathTable_Arc.startangle,PathTable_Arc.endangle,PathTable_Arc.arcpathclockwisedir,0x0000ff);
|
|
//console.log(PathTable_Arc);
|
|
}
|
|
|
|
for(let l=0;l<PathTable_WayPoint_Arr.length;l++){
|
|
var PathTable_WayPoint=PathTable_WayPoint_Arr[l];
|
|
Lu_Draw_WayPoint(PathTable_WayPoint,0x0000ff);
|
|
}
|
|
|
|
for(let l=0;l<PathTable_Bezier_Arr.length;l++){
|
|
var PathTable_Bezier=PathTable_Bezier_Arr[l];
|
|
Lu_Draw_Bezier(PathTable_Bezier,0x0000ff);
|
|
}
|
|
|
|
for(let m=0;m<PathTable_OriginTurn_Arr.length;m++){
|
|
var PathTable_OriginTurn=PathTable_OriginTurn_Arr[m];
|
|
Lu_Draw_OriginTurn(PathTable_OriginTurn.centerpoint,PathTable_OriginTurn.frompoint,PathTable_OriginTurn.topoint,PathTable_OriginTurn.radius,PathTable_OriginTurn.startangle,PathTable_OriginTurn.endangle,PathTable_OriginTurn.arcpathclockwisedir,0x0000ff);
|
|
}
|
|
|
|
for(let n=0;n<NodePointManagerTable_PathNode_Arr.length;n++){
|
|
var PathNode=NodePointManagerTable_PathNode_Arr[n];
|
|
Lu_Draw_PathNode(PathNode,0XFFA500,"#00FFFF");
|
|
}
|
|
|
|
|
|
|
|
draw_sch=5;
|
|
}
|
|
else if(draw_sch==5){
|
|
render();
|
|
draw_sch=6;
|
|
}
|
|
//else{
|
|
|
|
if(period_times>=0) {
|
|
period_times=0;
|
|
Car.circle.position.copy(new THREE.Vector3(Car_Global_rx, Car_Global_ry, 0.2));
|
|
Car.line.position.copy(new THREE.Vector3(Car_Global_rx, Car_Global_ry, 0.2));
|
|
Car.line.rotation.z = Car_Global_Theta * Math.PI / 180.0;
|
|
|
|
if(Get_Bosch_Frame_Sch>0&&Get_Bosch_Frame_Sch!=Last_Get_Bosch_Frame_Sch){
|
|
Last_Get_Bosch_Frame_Sch=Get_Bosch_Frame_Sch;
|
|
//console.log(Last_Get_Bosch_Frame_Sch);
|
|
for(let i=0;i<Math.min(Bosch_Msg.Point_Arr.length,Bosch.Sprite_Arr.length);i++){
|
|
var GP=Bosch_Msg.Point_Arr[i];
|
|
//console.log(Bosch_Point);
|
|
Bosch.Sprite_Arr[i].position.copy(new THREE.Vector3(GP.x, GP.y, GP.z));
|
|
}
|
|
|
|
}
|
|
|
|
if(Get_NAV350_Frame_Sch>0&&Get_NAV350_Frame_Sch!=Last_Get_NAV350_Frame_Sch){
|
|
Last_Get_NAV350_Frame_Sch=Get_NAV350_Frame_Sch;
|
|
//console.log(NAV350_Msg);
|
|
for(let i=0;i<NAV350.Sprite_Arr.length;i++){
|
|
var GP=NAV350_Msg.Dist_Rssi_Point_Arr[i].GlobalPosition;
|
|
NAV350.Sprite_Arr[i].position.copy(new THREE.Vector3(GP.x, GP.y, 0.2));
|
|
var RSSI=Math.round(NAV350_Msg.Dist_Rssi_Point_Arr[i].RSSI*1000);
|
|
//console.log(RSSI);
|
|
var green =(RSSI & 0x000000ff)/255;
|
|
var blue = ((RSSI >> 8) & 0x000000ff)/255;
|
|
//console.log(green+" "+blue);
|
|
NAV350.Sprite_Arr[i].material.color.setRGB(1,green,blue);
|
|
//NAV350.Sprite_Arr[i].material.color.setRGB(255,green,blue);//.setHex(0x00ff00);
|
|
}
|
|
|
|
|
|
|
|
//console.log(NAV350.LandMarker_Arr.length);
|
|
for(let i=0;i<NAV350.LandMarker_Arr.length;i++){
|
|
var LandMarker=NAV350.LandMarker_Arr[i];
|
|
if(i<NAV350_Msg.Reflector_Arr.length){
|
|
//console.log(NAV350_Msg.Reflector_Arr[i]);
|
|
var ReflectGlobalPosition=NAV350_Msg.Reflector_Arr[i].ReflectGlobalPosition;
|
|
var Quality=(NAV350_Msg.Reflector_Arr[i].Quality)/65535.0;
|
|
var ReflectorsHitCount=NAV350_Msg.Reflector_Arr[i].ReflectorsHitCount/255.0;
|
|
//console.log(ReflectGlobalPosition);
|
|
Lu_Set_LandMarker(LandMarker,ReflectGlobalPosition.x, ReflectGlobalPosition.y, 0.2,true,1,Quality,ReflectorsHitCount);
|
|
/*
|
|
LandMarker.Circle.position.copy(new THREE.Vector3(ReflectGlobalPosition.x, ReflectGlobalPosition.y, 0.2));
|
|
LandMarker.Line1.position.copy(new THREE.Vector3(ReflectGlobalPosition.x, ReflectGlobalPosition.y, 0.2));
|
|
LandMarker.Line2.position.copy(new THREE.Vector3(ReflectGlobalPosition.x, ReflectGlobalPosition.y, 0.2));
|
|
LandMarker.Circle.material.color.setRGB(1,Quality,ReflectorsHitCount);
|
|
LandMarker.Line1.material.color.setRGB(1,Quality,ReflectorsHitCount);
|
|
LandMarker.Line2.material.color.setRGB(1,Quality,ReflectorsHitCount);
|
|
LandMarker.Circle.visible=true;
|
|
LandMarker.Line1.visible=true;
|
|
LandMarker.Line2.visible=true;
|
|
*/
|
|
}
|
|
else{
|
|
Lu_Set_LandMarker(LandMarker,0.0, 0.0, 0.2,false,0,0,0);
|
|
/*
|
|
LandMarker.Circle.position.copy(new THREE.Vector3(0.0, 0.0, 0.2));
|
|
LandMarker.Line1.position.copy(new THREE.Vector3(0.0, 0.0, 0.2));
|
|
LandMarker.Line2.position.copy(new THREE.Vector3(0.0, 0.0, 0.2));
|
|
LandMarker.Circle.material.color.setRGB(0,0,0);
|
|
LandMarker.Line1.material.color.setRGB(0,0,0);
|
|
LandMarker.Line2.material.color.setRGB(0,0,0);
|
|
LandMarker.Circle.visible=false;
|
|
LandMarker.Line1.visible=false;
|
|
LandMarker.Line2.visible=false;
|
|
*/
|
|
}
|
|
}
|
|
/*
|
|
for(let i=0;i<NAV350.LandMarker_Arr.length;i++){
|
|
var LandMarker=NAV350.LandMarker_Arr[i];
|
|
LandMarker.Circle.traverse(function(obj) {
|
|
if (obj.type === 'Mesh') {
|
|
obj.geometry.dispose();
|
|
obj.material.dispose();
|
|
}
|
|
});
|
|
LandMarker.Line1.traverse(function(obj) {
|
|
if (obj.type === 'Mesh') {
|
|
obj.geometry.dispose();
|
|
obj.material.dispose();
|
|
}
|
|
});
|
|
LandMarker.Line2.traverse(function(obj) {
|
|
if (obj.type === 'Mesh') {
|
|
obj.geometry.dispose();
|
|
obj.material.dispose();
|
|
}
|
|
});
|
|
scene.remove(LandMarker.Circle);
|
|
scene.remove(LandMarker.Line1);
|
|
scene.remove(LandMarker.Line2);
|
|
|
|
}
|
|
NAV350.LandMarker_Arr=[];
|
|
for(let i=0;i<NAV350_Msg.Reflector_Arr.length;i++){
|
|
var LandMarker_Position=NAV350_Msg.Reflector_Arr[i].ReflectGlobalPosition;
|
|
var LandMarker_Size=NAV350_Msg.Reflector_Arr[i].ReflectorSize;
|
|
var LandMarker=Lu_Draw_LandMarker(LandMarker_Position,LandMarker_Size,0xff2f00);
|
|
NAV350.LandMarker_Arr.push(LandMarker);
|
|
}
|
|
*/
|
|
}
|
|
|
|
if(Get_WLR712_Frame_Sch>0&&Get_WLR712_Frame_Sch!=Last_Get_WLR712_Fraem_Sch){
|
|
Last_Get_WLR712_Fraem_Sch=Get_WLR712_Frame_Sch;
|
|
for(let i=0;i<WLR712.Sprite_Arr.length;i++){
|
|
var GP=WLR712_Msg.Dist_Rssi_Point_Arr[i].GlobalPosition;
|
|
WLR712.Sprite_Arr[i].position.copy(new THREE.Vector3(GP.x, GP.y, 0.2));
|
|
|
|
var RSSI=Math.round(WLR712_Msg.Dist_Rssi_Point_Arr[i].RSSI*1000);
|
|
//console.log(RSSI);
|
|
var green =(RSSI & 0x000000ff)/255;
|
|
var blue = ((RSSI >> 8) & 0x000000ff)/255;
|
|
//console.log(green+" "+blue);
|
|
WLR712.Sprite_Arr[i].material.color.setRGB(1,green,blue);
|
|
|
|
//NAV350.Sprite_Arr[i].material.color.setRGB(255,green,blue);//.setHex(0x00ff00);
|
|
}
|
|
|
|
for(let i=0;i<WLR712.LandMarker_Arr.length;i++){
|
|
var LandMarker=WLR712.LandMarker_Arr[i];
|
|
if(i<WLR712_Msg.Reflector_Arr.length){
|
|
//console.log(NAV350_Msg.Reflector_Arr[i]);
|
|
var ReflectGlobalPosition=WLR712_Msg.Reflector_Arr[i].ReflectGlobalPosition;
|
|
var Quality=0xFF;//(WLR712_Msg.Reflector_Arr[i].Quality)/65535.0;
|
|
var ReflectorsHitCount=WLR712_Msg.Reflector_Arr[i].ReflectorsHitCount/255.0;
|
|
//console.log(ReflectGlobalPosition);
|
|
Lu_Set_LandMarker(LandMarker,ReflectGlobalPosition.x, ReflectGlobalPosition.y, 0.2,true,1,Quality,ReflectorsHitCount);
|
|
|
|
}
|
|
else{
|
|
Lu_Set_LandMarker(LandMarker,0.0, 0.0, 0.2,false,0,0,0);
|
|
|
|
}
|
|
}
|
|
}
|
|
render();
|
|
}
|
|
//}
|
|
|
|
//console.log(draw_sch);
|
|
}
|
|
var T1 = window.setInterval("Timer()",100);
|
|
|
|
|
|
/*
|
|
|
|
*/
|
|
/*
|
|
const material_x = new THREE.LineBasicMaterial( { color: 0x00ff00 } );
|
|
const points_x = [];
|
|
points_x.push( new THREE.Vector3( 0, 0, 0 ) );
|
|
points_x.push( new THREE.Vector3( 10, 0, 0 ) );
|
|
const geometry_x = new THREE.BufferGeometry().setFromPoints( points_x );
|
|
const line_x = new THREE.Line( geometry_x, material_x);
|
|
scene.add( line_x);
|
|
|
|
const material_y = new THREE.LineBasicMaterial( { color: 0xff0000 } );
|
|
const points_y = [];
|
|
points_y.push( new THREE.Vector3( 0, 0, 0 ) );
|
|
points_y.push( new THREE.Vector3( 0, 10, 0 ) );
|
|
const geometry_y = new THREE.BufferGeometry().setFromPoints( points_y );
|
|
const line_y = new THREE.Line( geometry_y, material_y );
|
|
scene.add( line_y);
|
|
*/
|
|
/**
|
|
* 光源设置
|
|
*/
|
|
//点光源
|
|
var point = new THREE.PointLight(0xffffff);
|
|
point.position.set(10, 10, 10); //点光源位置
|
|
scene.add(point); //点光源添加到场景中
|
|
//环境光
|
|
var ambient = new THREE.AmbientLight(0x444444);
|
|
scene.add(ambient);
|
|
/**
|
|
* 相机设置
|
|
*/
|
|
var width = window.innerWidth; //窗口宽度
|
|
var height = window.innerHeight; //窗口高度
|
|
var k = width / height; //窗口宽高比
|
|
var s = 30;//5; //三维场景显示范围控制系数，系数越大，显示的范围越大
|
|
//创建相机对象
|
|
var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000);
|
|
camera.position.set(0, 0, 20);
|
|
//camera.position.set(0, 0, 10); //设置相机位置
|
|
//console.log("Rotation", camera.rotation);
|
|
camera.lookAt(scene.position); //设置相机方向(指向的场景对象)
|
|
|
|
/**
|
|
* 创建渲染器对象
|
|
*/
|
|
var renderer = new THREE.WebGLRenderer({ antialias: true });
|
|
renderer.setSize(width, height);//设置渲染区域尺寸
|
|
renderer.setClearColor(0x000000, 1); //设置背景颜色
|
|
//renderer.setClearColor(0xb9d3ff, 1); //设置背景颜色
|
|
document.body.appendChild(renderer.domElement); //body元素中插入canvas对象
|
|
//执行渲染操作 指定场景、相机作为参数
|
|
function render() {
|
|
renderer.render(scene,camera);//执行渲染操作
|
|
}
|
|
render();
|
|
|
|
|
|
var controls = new THREE.OrbitControls(camera,renderer.domElement);//创建控件对象
|
|
controls.target.set( 0, 0, 0 ); // view direction perpendicular to XY-plane
|
|
controls.enableRotate = false;
|
|
controls.enableZoom = true; // optional
|
|
controls.mouseButtons = {
|
|
LEFT: THREE.MOUSE.RIGHT,
|
|
MIDDLE: THREE.MOUSE.MIDDLE,
|
|
RIGHT: THREE.MOUSE.LEFT
|
|
}
|
|
controls.addEventListener('change', render);//监听鼠标、键盘事件
|
|
|
|
|
|
var Szoom = 30;
|
|
|
|
$( "#threejs-reset" ).click(function(e){
|
|
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
Szoom = 30;
|
|
s = Szoom;
|
|
camera.left=-s*k;
|
|
camera.right=s*k;
|
|
camera.top=s;
|
|
camera.bottom=-s;
|
|
camera.near=1;
|
|
camera.far=1000;
|
|
camera.updateProjectionMatrix();
|
|
controls.reset();
|
|
//render();
|
|
});
|
|
|
|
|
|
$( "#threejs-zoom-in" ).click(function(e){
|
|
|
|
if(Szoom>=5) {
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
Szoom -= 1;
|
|
s = Szoom;
|
|
camera.left = -s * k;
|
|
camera.right = s * k;
|
|
camera.top = s;
|
|
camera.bottom = -s;
|
|
camera.near=1;
|
|
camera.far=1000;
|
|
//camera.position.set(0, 0, 20);
|
|
//camera.lookAt(scene.position); //设置相机方向(指向的场景对象)
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
}
|
|
console.log(Szoom);
|
|
});
|
|
|
|
$( "#threejs-zoom-out" ).click(function(e){
|
|
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
Szoom += 1;
|
|
s = Szoom;
|
|
camera.left=-s*k;
|
|
camera.right=s*k;
|
|
camera.top=s;
|
|
camera.bottom=-s;
|
|
camera.near=1;
|
|
camera.far=1000;
|
|
//camera.position.set(0, 0, 20);
|
|
//camera.lookAt(scene.position); //设置相机方向(指向的场景对象)
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
});
|
|
|
|
|
|
$( "#threejs-up" ).click(function(e){
|
|
/*
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
camera.top=camera.top+1;
|
|
camera.bottom=camera.bottom+1;
|
|
*/
|
|
camera.position.y=camera.position.y+1;
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
});
|
|
|
|
$( "#threejs-down" ).click(function(e){
|
|
/*
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
camera.top=camera.top-1;
|
|
camera.bottom=camera.bottom-1;
|
|
*/
|
|
camera.position.y=camera.position.y-1;
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
});
|
|
|
|
|
|
$( "#threejs-left" ).click(function(e){
|
|
/*
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
camera.left= camera.left+1;
|
|
camera.right=camera.right+1;
|
|
*/
|
|
camera.position.x=camera.position.x-1;
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
});
|
|
|
|
$( "#threejs-right" ).click(function(e){
|
|
/*
|
|
width = window.innerWidth; //窗口宽度
|
|
height = window.innerHeight; //窗口高度
|
|
k = width / height; //窗口宽高比
|
|
camera.left= camera.left-1;
|
|
camera.right=camera.right-1;
|
|
*/
|
|
camera.position.x=camera.position.x+1;
|
|
camera.updateProjectionMatrix();
|
|
//render();
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|