tvolkmann/gyrogpsc
1
0
Fork 0
Code Issues Pull Requests Projects 1 Releases 1 Wiki Activity

clean up js code

Browse Source
This commit is contained in:
unknown 2021-01-13 13:16:59 +01:00
parent 205c0bdec0
commit c3246200d0
11 changed files with 152 additions and 328 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.idea/vcs.xml generated
View File

@ -2,5 +2,6 @@
<project version="4"> <project version="4">
<component name="VcsDirectoryMappings"> <component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" /> <mapping directory="$PROJECT_DIR$" vcs="Git" />
<mapping directory="$PROJECT_DIR$/static/indicators" vcs="Git" />
</component> </component>
</project> </project>

107
static/scripts/accChart.js
View File

@ -1,9 +1,8 @@
let allAccSerial = [] let allAccSerial = []
let allSerialCoords = [] let allSerialCoords = []
var ctx = document.getElementById('accChart').getContext('2d'); let ctx = document.getElementById('accChart').getContext('2d');
var accChart = new Chart(ctx, { let accChart = new Chart(ctx, {
type: 'line', type: 'line',
data: { data: {
labels: [], labels: [],
@ -59,42 +58,7 @@ var accChart = new Chart(ctx, {
} }
}); });
function addDistances(tcpDataList, serialDataList){ function addDistances(data){
let tcpCoords = []
let serialCoords = []
let tcpTimes = []
let serialHAccs = []
let distances = []
indexes.forEach(index => {
serialHAccs.push(allAccSerial[index].toFixed(2))
serialCoords.push(allSerialCoords[index])
})
tcpDataList.forEach(sensordata => {
if(!(sensordata.Speed === 0) && !(sensordata.HAcc === 0)){
if (!(sensordata.Position[0] === 0) && !(sensordata.Position[1] === 0)) {
let tcpCoord = [sensordata.Position[1], sensordata.Position[0]]
tcpCoords.push(tcpCoord)
let time = sensordata.Timestamp
tcpTimes.push(time)
}
}
})
for(let i = 0; i < tcpCoords.length; i++){
let distance = distanceInMetersBetweenEarthCoordinates(serialCoords[i],tcpCoords[i])
distances.push(distance)
}
accChart.data.labels = tcpTimes
accChart.data.datasets[0].data = serialHAccs
accChart.data.datasets[1].data = distances
accChart.update()
}
function addDistancesNew(data){
let serialHAccs = data.map(el => { let serialHAccs = data.map(el => {
return el.ser.HAcc return el.ser.HAcc
}) })
@ -122,25 +86,24 @@ function addDistancesNew(data){
accChart.update() accChart.update()
} }
//https://www.movable-type.co.uk/scripts/latlong.html
function distanceInMetersBetweenEarthCoordinates(coord1, coord2) { function distanceInMetersBetweenEarthCoordinates(coord1, coord2) {
var long1 = coord1[0] let long1 = coord1[0]
var lat1 = coord1[1] let lat1 = coord1[1]
var long2 = coord2[0] let long2 = coord2[0]
var lat2 = coord2[1] let lat2 = coord2[1]
var earthRadiusM = 6371000 let earthRadiusM = 6371000
var phi1 = lat1 * Math.PI / 180 let phi1 = lat1 * Math.PI / 180
var phi2 = lat2 * Math.PI / 180 let phi2 = lat2 * Math.PI / 180
var dlat = (lat2-lat1) * Math.PI / 180 let dlat = (lat2-lat1) * Math.PI / 180
var dlong = (long2 - long1) * Math.PI / 180 let dlong = (long2 - long1) * Math.PI / 180
var a = Math.sin(dlat/2) * Math.sin(dlat/2) + let a = Math.sin(dlat/2) * Math.sin(dlat/2) +
Math.cos(phi1) * Math.cos(phi2) * Math.cos(phi1) * Math.cos(phi2) *
Math.sin(dlong/2) * Math.sin(dlong/2) Math.sin(dlong/2) * Math.sin(dlong/2)
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)) let c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a))
return earthRadiusM * c return earthRadiusM * c
} }
@ -152,26 +115,26 @@ function distVincenty(coord1, coord2) {
const lat1 = coord1[1] const lat1 = coord1[1]
const lon2 = coord2[0] const lon2 = coord2[0]
const lat2 = coord2[1] const lat2 = coord2[1]
var a = 6378137, b = 6356752.314245, f = 1/298.257223563; // WGS-84 ellipsoid params const a = 6378137, b = 6356752.314245, f = 1/298.257223563; // WGS-84 ellipsoid params
var L = (lon2-lon1).toRad() let L = (lon2-lon1).toRad()
var U1 = Math.atan((1-f) * Math.tan(lat1.toRad())); let U1 = Math.atan((1-f) * Math.tan(lat1.toRad()));
var U2 = Math.atan((1-f) * Math.tan(lat2.toRad())); let U2 = Math.atan((1-f) * Math.tan(lat2.toRad()));
var sinU1 = Math.sin(U1), cosU1 = Math.cos(U1); let sinU1 = Math.sin(U1), cosU1 = Math.cos(U1);
var sinU2 = Math.sin(U2), cosU2 = Math.cos(U2); let sinU2 = Math.sin(U2), cosU2 = Math.cos(U2);
var lambda = L, lambdaP, iterLimit = 100; let lambda = L, lambdaP, iterLimit = 100;
do { do {
var sinLambda = Math.sin(lambda), cosLambda = Math.cos(lambda); let sinLambda = Math.sin(lambda), cosLambda = Math.cos(lambda);
var sinSigma = Math.sqrt((cosU2*sinLambda) * (cosU2*sinLambda) + let sinSigma = Math.sqrt((cosU2*sinLambda) * (cosU2*sinLambda) +
(cosU1*sinU2-sinU1*cosU2*cosLambda) * (cosU1*sinU2-sinU1*cosU2*cosLambda)); (cosU1*sinU2-sinU1*cosU2*cosLambda) * (cosU1*sinU2-sinU1*cosU2*cosLambda));
if (sinSigma===0) return 0; // co-incident points if (sinSigma===0) return 0; // co-incident points
var cosSigma = sinU1*sinU2 + cosU1*cosU2*cosLambda; let cosSigma = sinU1*sinU2 + cosU1*cosU2*cosLambda;
var sigma = Math.atan2(sinSigma, cosSigma); let sigma = Math.atan2(sinSigma, cosSigma);
var sinAlpha = cosU1 * cosU2 * sinLambda / sinSigma; let sinAlpha = cosU1 * cosU2 * sinLambda / sinSigma;
var cosSqAlpha = 1 - sinAlpha*sinAlpha; let cosSqAlpha = 1 - sinAlpha*sinAlpha;
var cos2SigmaM = cosSigma - 2*sinU1*sinU2/cosSqAlpha; let cos2SigmaM = cosSigma - 2*sinU1*sinU2/cosSqAlpha;
if (isNaN(cos2SigmaM)) cos2SigmaM = 0; // equatorial line: cosSqAlpha=0 (§6) if (isNaN(cos2SigmaM)) cos2SigmaM = 0; // equatorial line: cosSqAlpha=0 (§6)
var C = f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha)); let C = f/16*cosSqAlpha*(4+f*(4-3*cosSqAlpha));
lambdaP = lambda; lambdaP = lambda;
lambda = L + (1-C) * f * sinAlpha * lambda = L + (1-C) * f * sinAlpha *
(sigma + C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM))); (sigma + C*sinSigma*(cos2SigmaM+C*cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)));
@ -179,13 +142,13 @@ function distVincenty(coord1, coord2) {
if (iterLimit===0) return NaN // formula failed to converge if (iterLimit===0) return NaN // formula failed to converge
var uSq = cosSqAlpha * (a*a - b*b) / (b*b); let uSq = cosSqAlpha * (a*a - b*b) / (b*b);
var A = 1 + uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq))); let A = 1 + uSq/16384*(4096+uSq*(-768+uSq*(320-175*uSq)));
var B = uSq/1024 * (256+uSq*(-128+uSq*(74-47*uSq))); let B = uSq/1024 * (256+uSq*(-128+uSq*(74-47*uSq)));
var deltaSigma = B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)- let deltaSigma = B*sinSigma*(cos2SigmaM+B/4*(cosSigma*(-1+2*cos2SigmaM*cos2SigmaM)-
B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM))); B/6*cos2SigmaM*(-3+4*sinSigma*sinSigma)*(-3+4*cos2SigmaM*cos2SigmaM)));
var s = b*A*(sigma-deltaSigma); let s = b*A*(sigma-deltaSigma);
s = s.toFixed(3); // round to 1mm precision s = s.toFixed(3); // round to 1mm precision
return s; return s;
} }

7
static/scripts/accuracy.js
View File

@ -50,9 +50,4 @@ function addTCPAccuracy(hacc, vacc){
function addDistanceToBarChart(dist){ function addDistanceToBarChart(dist){
barChart.data.datasets[2].data = [dist]; barChart.data.datasets[2].data = [dist];
barChart.update(); barChart.update();
} }
//Farbe der Lampen ändern
// AN: document.getElementById("greenlamp").style.backgroundColor = 'rgba(0, 230, 64, 1)'
// AUS: document.getElementById("greenlamp").style.backgroundColor = 'rgba(0, 100, 0, 1)'
// AN: document.getElementById("redlamp").style.backgroundColor = 'rgba(242, 38, 19, 1)'
// AUS: document.getElementById("redlamp").style.backgroundColor = 'rgba(139, 0, 0, 1)'

92
static/scripts/cubes.js
View File

@ -1,44 +1,42 @@
var width = document.getElementById("viewport").offsetWidth let width = document.getElementById("viewport").offsetWidth
var height = 300; let height = 300;
var renderer = new THREE.WebGLRenderer({ antialias: true }); let renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(width, height); renderer.setSize(width, height);
document.getElementById("viewport").appendChild(renderer.domElement); document.getElementById("viewport").appendChild(renderer.domElement);
var scene = new THREE.Scene(); let scene = new THREE.Scene();
let cubeGeometry = new THREE.CubeGeometry(100, 100/2, 100*1.5);
let cubeGeometry2 = new THREE.CubeGeometry(120, 120/2, 120*1.5);
var cubeGeometry = new THREE.CubeGeometry(100, 100/2, 100*1.5);
var cubeGeometry2 = new THREE.CubeGeometry(120, 120/2, 120*1.5);
// var cubeMaterial = new THREE.MeshLambertMaterial({ color: 0xffffff });
const color = new THREE.Color("rgb(255, 0, 0)"); const color = new THREE.Color("rgb(255, 0, 0)");
var cubeMaterial = new THREE.MeshPhongMaterial({ let cubeMaterial = new THREE.MeshPhongMaterial({
color: color, color: color,
opacity: 1, opacity: 1,
transparent: true, transparent: true,
}); });
const color2 = new THREE.Color("rgb(48,117,255)"); const color2 = new THREE.Color("rgb(48,117,255)");
var cubeMaterial2 = new THREE.MeshPhongMaterial({ let cubeMaterial2 = new THREE.MeshPhongMaterial({
color: color2, color: color2,
opacity: 0.5, opacity: 0.5,
transparent: true, transparent: true,
}); });
var cube = new THREE.Mesh(cubeGeometry, cubeMaterial); let cube = new THREE.Mesh(cubeGeometry, cubeMaterial);
var cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2); let cube2 = new THREE.Mesh(cubeGeometry2, cubeMaterial2);
// cube.rotation.y = Math.PI * 45 / 180;
// cube2.rotation.y = Math.PI * 45 / 180;
scene.add(cube); scene.add(cube);
scene.add(cube2); scene.add(cube2);
var camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 6000); let camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 6000);
camera.position.y = 100; camera.position.y = 100;
camera.position.z = 240; camera.position.z = 240;
camera.lookAt(cube.position); camera.lookAt(cube.position);
scene.add(camera); scene.add(camera);
var skyboxGeometry = new THREE.CubeGeometry(5000, 5000, 5000); let skyboxGeometry = new THREE.CubeGeometry(5000, 5000, 5000);
var skyboxMaterial = new THREE.MeshBasicMaterial({ color: 0x232323, side: THREE.BackSide }); let skyboxMaterial = new THREE.MeshBasicMaterial({ color: 0x232323, side: THREE.BackSide });
var skybox = new THREE.Mesh(skyboxGeometry, skyboxMaterial); let skybox = new THREE.Mesh(skyboxGeometry, skyboxMaterial);
scene.add(skybox); scene.add(skybox);
@ -46,7 +44,7 @@ const colorl = 0xFFFFFF;
const intensity = 1; const intensity = 1;
const light = new THREE.DirectionalLight(colorl, intensity); const light = new THREE.DirectionalLight(colorl, intensity);
var pointLight = new THREE.PointLight(0xffffff); let pointLight = new THREE.PointLight(0xffffff);
pointLight.position.set(0, 300, 200); pointLight.position.set(0, 300, 200);
light.position.set(0, 300, 200); light.position.set(0, 300, 200);
@ -66,10 +64,8 @@ let quaternionOffset = document.getElementById("quaternionOffset")
function renderTCP(x, y, z) { function renderTCP(x, y, z) {
let calibration = new THREE.Quaternion().setFromEuler(manCalibration) let calibration = new THREE.Quaternion().setFromEuler(manCalibration)
// let calibration = new THREE.Quaternion().setFromEuler(new THREE.Euler( radFromAngle, 0, 0, 'YXZ' ))
let eul = new THREE.Euler( x, y, z, 'YXZ' ); let eul = new THREE.Euler( x, y, z, 'YXZ' );
// let eul = new THREE.Euler( x, z, y, 'ZXY' ); // XYZ XZY YZX YXZ ZXY ZYX
cube2.quaternion.setFromEuler(eul).multiply(calibrationRot).multiply(calibration) cube2.quaternion.setFromEuler(eul).multiply(calibrationRot).multiply(calibration)
quaternionOffset.innerHTML = `Lage Abweichung: ${(cube2.quaternion.angleTo(cube.quaternion) * 180 / Math.PI).toFixed(2) }°` quaternionOffset.innerHTML = `Lage Abweichung: ${(cube2.quaternion.angleTo(cube.quaternion) * 180 / Math.PI).toFixed(2) }°`
@ -78,8 +74,6 @@ function renderTCP(x, y, z) {
} }
function renderSerial(x, y, z) { function renderSerial(x, y, z) {
// requestAnimationFrame(renderSerial);
let eul = new THREE.Euler( x, y, z, 'YXZ' ); // XYZ XZY YZX YXZ ZXY ZYX let eul = new THREE.Euler( x, y, z, 'YXZ' ); // XYZ XZY YZX YXZ ZXY ZYX
cube.quaternion.setFromEuler(eul) cube.quaternion.setFromEuler(eul)
@ -90,14 +84,12 @@ function renderSerial(x, y, z) {
renderTCP(0, 0, 0); renderTCP(0, 0, 0);
renderSerial(0, 0, 0); renderSerial(0, 0, 0);
var pitchRange = document.getElementById("pitchRange"); let pitchRange = document.getElementById("pitchRange");
var yawRange = document.getElementById("yawRange"); let yawRange = document.getElementById("yawRange");
var rollRange = document.getElementById("rollRange"); let rollRange = document.getElementById("rollRange");
pitchRange.oninput = () => { pitchRange.oninput = () => {
manCalibration.x = pitchRange.value * Math.PI / 180 manCalibration.x = pitchRange.value * Math.PI / 180
// let rot = new THREE.Euler().setFromQuaternion( cube2.quaternion, 'YXZ' );
// renderTCP(rot.x, rot.y, rot.z)
} }
yawRange.oninput = () => { yawRange.oninput = () => {
manCalibration.y = yawRange.value * Math.PI / 180 manCalibration.y = yawRange.value * Math.PI / 180
@ -116,7 +108,7 @@ function delCalibration(evt) {
calPitch = 0 calPitch = 0
} }
var calState = false; let calState = false;
function manualCalibration(evt) { function manualCalibration(evt) {
let con = document.getElementById("manCalContainer") let con = document.getElementById("manCalContainer")
console.log("mancal", con.style.display) console.log("mancal", con.style.display)
@ -134,7 +126,6 @@ function manualCalibration(evt) {
pitchRange.value = 0 pitchRange.value = 0
yawRange.value = 0 yawRange.value = 0
rollRange.value = 0 rollRange.value = 0
} }
} }
function calibrate(evt) { function calibrate(evt) {
@ -150,7 +141,7 @@ function calibrate(evt) {
calYaw = dif.y // * 180/Math.PI calYaw = dif.y // * 180/Math.PI
calRoll = dif.z // * 180/Math.PI calRoll = dif.z // * 180/Math.PI
calibrationRot = diff calibrationRot = diff
}; }
document.getElementById("deleteCalibration").onclick = delCalibration document.getElementById("deleteCalibration").onclick = delCalibration
document.getElementById("manualCalibration").onclick = manualCalibration document.getElementById("manualCalibration").onclick = manualCalibration
document.getElementById("calibrate").onclick = calibrate document.getElementById("calibrate").onclick = calibrate
@ -158,7 +149,7 @@ document.getElementById("calibrate").onclick = calibrate
// indicators // // indicators //
var options = { let options = {
size : 200, // Sets the size in pixels of the indicator (square) size : 200, // Sets the size in pixels of the indicator (square)
roll : 0, // Roll angle in degrees for an attitude indicator roll : 0, // Roll angle in degrees for an attitude indicator
pitch : 0, // Pitch angle in degrees for an attitude indicator pitch : 0, // Pitch angle in degrees for an attitude indicator
@ -171,34 +162,23 @@ var options = {
img_directory : 'static/indicators/img/' // The directory where the images are saved to img_directory : 'static/indicators/img/' // The directory where the images are saved to
} }
var headingSer = $.flightIndicator('#headingSer', 'heading', options); let headingSer = $.flightIndicator('#headingSer', 'heading', options);
var headingTcp = $.flightIndicator('#headingTcp', 'heading', options); let headingTcp = $.flightIndicator('#headingTcp', 'heading', options);
var attitudeSer = $.flightIndicator('#attitudeSer', 'attitude', options); let attitudeSer = $.flightIndicator('#attitudeSer', 'attitude', options);
var attitudeTcp = $.flightIndicator('#attitudeTcp', 'attitude', options); let attitudeTcp = $.flightIndicator('#attitudeTcp', 'attitude', options);
// var variometer = $.flightIndicator('#variometer', 'variometer', options); let airspeed = $.flightIndicator('#airspeed', 'airspeed', options);
var airspeed = $.flightIndicator('#airspeed', 'airspeed', options); let altimeter = $.flightIndicator('#altimeter', 'altimeter', options);
var altimeter = $.flightIndicator('#altimeter', 'altimeter', options);
var airspeedLabel = document.getElementById("airspeedLabel") let airspeedLabel = document.getElementById("airspeedLabel")
var altitudeLabel = document.getElementById("altitudeLabel") let altitudeLabel = document.getElementById("altitudeLabel")
function setIndicatorsTcp(sensordata) { function setIndicatorsTcp(sensordata) {
// let q = new THREE.Euler().setFromQuaternion( quaternionRawTcp, 'YXZ' ) // XYZ XZY YZX YXZ ZXY ZYX
let q = new THREE.Euler().setFromQuaternion( cube2.quaternion, 'YXZ' ) // XYZ XZY YZX YXZ ZXY ZYX let q = new THREE.Euler().setFromQuaternion( cube2.quaternion, 'YXZ' ) // XYZ XZY YZX YXZ ZXY ZYX
if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) { if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) {
//attitudeTcp.setPitch(sensordata.Orientation[0])
attitudeTcp.setPitch(q.x * 180 / Math.PI) attitudeTcp.setPitch(q.x * 180 / Math.PI)
//attitudeTcp.setRoll(sensordata.Orientation[1])
attitudeTcp.setRoll(q.z * 180 / Math.PI) attitudeTcp.setRoll(q.z * 180 / Math.PI)
} }
// Heading from quaternion
// if (sensordata.Orientation[2] !== 0) {
// // headingTcp.setHeading((-sensordata.Orientation[2]-90)%360)
// let h = q.y * 180 / Math.PI * -1
// headingTcp.setHeading(h)
// }
let heading = sensordata.HeadDevice let heading = sensordata.HeadDevice
if (heading !== 0) { if (heading !== 0) {
headingTcp.setHeading(heading) headingTcp.setHeading(heading)
@ -206,19 +186,10 @@ function setIndicatorsTcp(sensordata) {
} }
function setIndicatorsSer(sensordata) { function setIndicatorsSer(sensordata) {
let q = new THREE.Euler().setFromQuaternion( cube.quaternion, 'YXZ' )
if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) { if (sensordata.Orientation[0] !== 0 && sensordata.Orientation[1] !== 0) {
attitudeSer.setPitch(sensordata.Orientation[0]) attitudeSer.setPitch(sensordata.Orientation[0])
attitudeSer.setRoll(sensordata.Orientation[1]) attitudeSer.setRoll(sensordata.Orientation[1])
} }
// Heading from quaternion
// if (sensordata.Orientation[2] !== 0) {
// // headingTcp.setHeading((-sensordata.Orientation[2]-90)%360)
// let h = q.y * 180 / Math.PI * -1
// headingSer.setHeading(h)
// }
let heading = sensordata.HeadMotion let heading = sensordata.HeadMotion
if (heading !== 0) { if (heading !== 0) {
headingSer.setHeading(heading) headingSer.setHeading(heading)
@ -231,5 +202,4 @@ function setIndicatorsSer(sensordata) {
altimeter.setAltitude((sensordata.Position[2] * 10).toFixed()) altimeter.setAltitude((sensordata.Position[2] * 10).toFixed())
altitudeLabel.innerHTML = `HMSL: ${(sensordata.Position[2]).toFixed(2)} m` altitudeLabel.innerHTML = `HMSL: ${(sensordata.Position[2]).toFixed(2)} m`
} }
} }

25
static/scripts/map.js
View File

@ -1,10 +1,10 @@
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg'; mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
var map = new mapboxgl.Map({ let map = new mapboxgl.Map({
container: 'map', container: 'map',
style: 'mapbox://styles/mapbox/satellite-v9', style: 'mapbox://styles/mapbox/satellite-v9',
zoom: 0 zoom: 0
}); });
var emptyTCP = { let emptyTCP = {
type: "FeatureCollection", type: "FeatureCollection",
features: [ features: [
{ {
@ -16,7 +16,7 @@ var emptyTCP = {
}] }]
} }
var emptySERIAL = { let emptySERIAL = {
type: "FeatureCollection", type: "FeatureCollection",
features: [ features: [
{ {
@ -65,33 +65,16 @@ map.on('load', function () {
map.jumpTo({ 'center': [9.19640999, 49.12283027], 'zoom': 16 }); map.jumpTo({ 'center': [9.19640999, 49.12283027], 'zoom': 16 });
map.setPitch(30); map.setPitch(30);
var stateLegendEl = document.getElementById('state-legend'); let stateLegendEl = document.getElementById('state-legend');
stateLegendEl.style.display = 'block'; stateLegendEl.style.display = 'block';
}) })
/*function updateMap (TCPlong, TCPlat, SERIALlong, SERIALlat) {
if(!(TCPlong === 0) && !(TCPlat === 0)){
emptyTCP.features[0].geometry.coordinates.push([TCPlong, TCPlat]);
map.getSource('routeTCP').setData(emptyTCP);
}
if(!(SERIALlong === 0) && !(SERIALlat === 0)){
emptySERIAL.features[0].geometry.coordinates.push([SERIALlong, SERIALlat]);
map.getSource('routeSERIAL').setData(emptySERIAL);
}
// else if (!([TCPlong, TCPlat] = [0,0])) {
// map.panTo([TCPlong, TCPlat]);
// }
map.panTo([TCPlong, TCPlat]);
}*/
function updateMapTCP (TCPlong, TCPlat) { function updateMapTCP (TCPlong, TCPlat) {
emptyTCP.features[0].geometry.coordinates.push([TCPlong, TCPlat]); emptyTCP.features[0].geometry.coordinates.push([TCPlong, TCPlat]);
map.getSource('routeTCP').setData(emptyTCP); map.getSource('routeTCP').setData(emptyTCP);
//map.panTo([TCPlong, TCPlat]);
} }
function updateMapSERIAL (SERIALlong, SERIALlat) { function updateMapSERIAL (SERIALlong, SERIALlat) {
emptySERIAL.features[0].geometry.coordinates.push([SERIALlong, SERIALlat]); emptySERIAL.features[0].geometry.coordinates.push([SERIALlong, SERIALlat]);
map.getSource('routeSERIAL').setData(emptySERIAL); map.getSource('routeSERIAL').setData(emptySERIAL);
//map.panTo([SERIALlong, SERIALlat]);
} }

4
static/scripts/mapfull.js
View File

@ -1,5 +1,5 @@
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg'; mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
var map = new mapboxgl.Map({ let map = new mapboxgl.Map({
container: 'map', container: 'map',
style: 'mapbox://styles/mapbox/satellite-v9', style: 'mapbox://styles/mapbox/satellite-v9',
zoom: 0 zoom: 0
@ -42,7 +42,7 @@ map.on('load', function () {
map.jumpTo({ 'center': [9.19640999, 49.12283027], 'zoom': 16 }); map.jumpTo({ 'center': [9.19640999, 49.12283027], 'zoom': 16 });
map.setPitch(30); map.setPitch(30);
var stateLegendEl = document.getElementById('state-legend'); let stateLegendEl = document.getElementById('state-legend');
stateLegendEl.style.display = 'block'; stateLegendEl.style.display = 'block';
}) })

35
static/scripts/refull.js
View File

@ -1,16 +1,15 @@
var trackingdata = null;
let indexes let indexes
function composeTimestamp(servertime){ function composeTimestamp(servertime){
var composed; let composed;
composed = servertime.slice(11,25).split(':').join("").split('.').join(""); composed = servertime.slice(11,25).split(':').join("").split('.').join("");
return composed; return composed;
} }
function findBestTimeMatch(num, arr) { function findBestTimeMatch(num, arr) {
var mid; let mid;
var lo = 0; let lo = 0;
var hi = arr.length - 1; let hi = arr.length - 1;
while (hi - lo > 1) { while (hi - lo > 1) {
mid = Math.floor ((lo + hi) / 2); mid = Math.floor ((lo + hi) / 2);
if (arr[mid] < num) { if (arr[mid] < num) {
@ -29,10 +28,10 @@ function findSerialDataIndex(tcpdataList, serialdataList) {
let allSerialTimes = [] let allSerialTimes = []
serialdataList.forEach(sensordata => { serialdataList.forEach(sensordata => {
if (!(sensordata.Speed === 0) && !(sensordata.HAcc === 0)) { if (sensordata.Speed !== 0 && sensordata.HAcc !== 0) {
allSpeedsSerial.push(sensordata.Speed) allSpeedsSerial.push(sensordata.Speed)
allAccSerial.push(sensordata.HAcc) allAccSerial.push(sensordata.HAcc)
if(!(sensordata.Position[1] === 0) && !(sensordata.Position[0] === 0)){ if(sensordata.Position[1] !== 0 && sensordata.Position[0] !== 0){
allSerialCoords.push([sensordata.Position[1], sensordata.Position[0]]) allSerialCoords.push([sensordata.Position[1], sensordata.Position[0]])
} }
let serialTimestamp = composeTimestamp(sensordata.Timestamp) let serialTimestamp = composeTimestamp(sensordata.Timestamp)
@ -41,7 +40,7 @@ function findSerialDataIndex(tcpdataList, serialdataList) {
}) })
tcpdataList.forEach(sensordata => { tcpdataList.forEach(sensordata => {
if (!(sensordata.Speed === 0) && !(sensordata.HAcc === 0)) { if (sensordata.Speed !== 0 && sensordata.HAcc !== 0) {
let tcpTimestamp = composeTimestamp(sensordata.Timestamp) let tcpTimestamp = composeTimestamp(sensordata.Timestamp)
let index = findBestTimeMatch(tcpTimestamp, allSerialTimes)[1] let index = findBestTimeMatch(tcpTimestamp, allSerialTimes)[1]
@ -51,9 +50,10 @@ function findSerialDataIndex(tcpdataList, serialdataList) {
} }
window.addEventListener("load", function(evt) { window.addEventListener("load", function(evt) {
//------------------------Buttons------------------------------ //------------------------Buttons------------------------------
var trackings = null; let trackings = null;
document.getElementById("messungladen").onclick = function(evt) { document.getElementById("messungladen").onclick = function(evt) {
fetch('http://localhost:3011/trackings/', { method: 'GET'}).then(results => { fetch('http://localhost:3011/trackings/', { method: 'GET'}).then(results => {
return results.json() return results.json()
@ -68,7 +68,7 @@ window.addEventListener("load", function(evt) {
r.data.sort((a,b) => new Date(b.TimeCreated).getTime() - new Date(a.TimeCreated).getTime()); r.data.sort((a,b) => new Date(b.TimeCreated).getTime() - new Date(a.TimeCreated).getTime());
r.data.forEach(tracking => { r.data.forEach(tracking => {
console.log(tracking) console.log(tracking)
var option = document.createElement("option"); let option = document.createElement("option");
option.text = tracking.TimeCreated + " Size: " + tracking.Size option.text = tracking.TimeCreated + " Size: " + tracking.Size
sel.add(option) sel.add(option)
}) })
@ -89,12 +89,10 @@ window.addEventListener("load", function(evt) {
fetch(`http://localhost:3011/trackings/${trackings[sel.selectedIndex].UUID}`, { method: 'GET'}).then(results => { fetch(`http://localhost:3011/trackings/${trackings[sel.selectedIndex].UUID}`, { method: 'GET'}).then(results => {
return results.json() return results.json()
}).then(r => { }).then(r => {
console.log(r.data.Data) // console.log(r.data.Data)
console.log(r.data) // console.log(r.data)
// if('SOURCE_TCP' in r.data.Data && r.data.Data.SOURCE_TCP.length > 0 && 'SOURCE_SERIAL' in r.data.Data && r.data.Data.SOURCE_SERIAL.length > 0){
findSerialDataIndex(r.data.Data.SOURCE_TCP, r.data.Data.SOURCE_SERIAL) findSerialDataIndex(r.data.Data.SOURCE_TCP, r.data.Data.SOURCE_SERIAL)
// addDistances(r.data.Data.SOURCE_TCP, r.data.Data.SOURCE_SERIAL)
// }
if ('SOURCE_TCP' in r.data.Data && r.data.Data.SOURCE_TCP.length > 0) { if ('SOURCE_TCP' in r.data.Data && r.data.Data.SOURCE_TCP.length > 0) {
updateMapTCPbulk(r.data.Data.SOURCE_TCP) updateMapTCPbulk(r.data.Data.SOURCE_TCP)
addTCPSpeedData(r.data.Data.SOURCE_TCP) addTCPSpeedData(r.data.Data.SOURCE_TCP)
@ -103,10 +101,8 @@ window.addEventListener("load", function(evt) {
updateMapSERIALbulk(r.data.Data.SOURCE_SERIAL) updateMapSERIALbulk(r.data.Data.SOURCE_SERIAL)
addSerialSpeedData() addSerialSpeedData()
} }
addDistancesNew(prepareForDistanceCalc(r.data.Data)) addDistances(prepareForDistanceCalc(r.data.Data))
}) })
} }
}); });
@ -114,7 +110,6 @@ function prepareForDistanceCalc(data) {
if('SOURCE_TCP' in data && data.SOURCE_TCP.length > 0 && 'SOURCE_SERIAL' in data && data.SOURCE_SERIAL.length > 0) { if('SOURCE_TCP' in data && data.SOURCE_TCP.length > 0 && 'SOURCE_SERIAL' in data && data.SOURCE_SERIAL.length > 0) {
let sensorPoints = []; let sensorPoints = [];
data.SOURCE_TCP.forEach(element => { data.SOURCE_TCP.forEach(element => {
// let ts = Date.parse(element.Timestamp)
if (element.Position[0] !== 0 && element.Position[1] !== 0) { if (element.Position[0] !== 0 && element.Position[1] !== 0) {
sensorPoints.push({ sensorPoints.push({
differenceMs: Number.MAX_VALUE, differenceMs: Number.MAX_VALUE,
@ -142,4 +137,4 @@ function prepareForDistanceCalc(data) {
return newSensorPoints return newSensorPoints
} }
return null return null
} }

8
static/scripts/speedChart.js
View File

@ -1,7 +1,7 @@
let allSpeedsSerial = [] let allSpeedsSerial = []
var ctx = document.getElementById('speedChart').getContext('2d'); let ctx = document.getElementById('speedChart').getContext('2d');
var speedChart = new Chart(ctx, { let speedChart = new Chart(ctx, {
type: 'line', type: 'line',
data: { data: {
labels: new Array(), labels: new Array(),
@ -56,7 +56,6 @@ function addSerialSpeedData() {
}) })
speedChart.data.datasets[0].data = speeds; speedChart.data.datasets[0].data = speeds;
speedChart.update(); speedChart.update();
console.log("speeds serial " + speeds.length)
} }
function addTCPSpeedData(sensordataList) { function addTCPSpeedData(sensordataList) {
@ -73,10 +72,7 @@ function addTCPSpeedData(sensordataList) {
times.push(time) times.push(time)
}) })
console.log("speeds tcp " + speedsTCP.length)
speedChart.data.labels = times; speedChart.data.labels = times;
speedChart.data.datasets[1].data = speedsTCP; speedChart.data.datasets[1].data = speedsTCP;
speedChart.update(); speedChart.update();
} }

30
static/scripts/speedometer.js
View File

@ -1,4 +1,4 @@
var options1 = { let options1 = {
type: 'doughnut', type: 'doughnut',
data: { data: {
datasets: [ datasets: [
@ -31,8 +31,8 @@ var options1 = {
] ]
}, },
options: { options: {
rotation: 1 * Math.PI, rotation: Math.PI,
circumference: 1 * Math.PI, circumference: Math.PI,
legend: { legend: {
display: false, display: false,
enabled: false enabled: false
@ -44,7 +44,7 @@ var options1 = {
cutoutPercentage: 40 cutoutPercentage: 40
} }
} }
var options2 = { let options2 = {
type: 'doughnut', type: 'doughnut',
data: { data: {
datasets: [ datasets: [
@ -129,8 +129,8 @@ var options2 = {
] ]
}, },
options: { options: {
rotation: 1 * Math.PI, rotation: Math.PI,
circumference: 1 * Math.PI, circumference: Math.PI,
legend: { legend: {
display: false, display: false,
enabled: false enabled: false
@ -143,23 +143,23 @@ var options2 = {
} }
} }
var ctx1 = document.getElementById('speedometer').getContext('2d'); let ctx1 = document.getElementById('speedometer').getContext('2d');
var mySpeedometer = new Chart(ctx1, options1); let mySpeedometer = new Chart(ctx1, options1);
var ctx2 = document.getElementById('speedometerSpeeds').getContext('2d'); let ctx2 = document.getElementById('speedometerSpeeds').getContext('2d');
var mySpeedometer2 = new Chart(ctx2, options2); let mySpeedometer2 = new Chart(ctx2, options2);
function addSpeedSerial(speedSERIAL){ function addSpeedSerial(speedSERIAL){
var speedSERIALkmh = (speedSERIAL * 3.6) let speedSERIALkmh = (speedSERIAL * 3.6)
var speedSERIALpercent = (speedSERIALkmh/250)*100 let speedSERIALpercent = (speedSERIALkmh/250)*100
mySpeedometer.data.datasets[1].data = [speedSERIALpercent, 100-speedSERIALpercent]; mySpeedometer.data.datasets[1].data = [speedSERIALpercent, 100-speedSERIALpercent];
document.getElementById("speedSERIAL").innerHTML = `Ublox: ${speedSERIALkmh.toFixed(1)} km/h` document.getElementById("speedSERIAL").innerHTML = `Ublox: ${speedSERIALkmh.toFixed(1)} km/h`
mySpeedometer.update(); mySpeedometer.update();
} }
function addSpeedTcp(speedTCP){ function addSpeedTcp(speedTCP){
var speedTCPkmh = (speedTCP * 3.6) let speedTCPkmh = (speedTCP * 3.6)
var speedTCPpercent = (speedTCPkmh/250)*100; let speedTCPpercent = (speedTCPkmh/250)*100;
mySpeedometer.data.datasets[0].data = [speedTCPpercent, 100-speedTCPpercent]; mySpeedometer.data.datasets[0].data = [speedTCPpercent, 100-speedTCPpercent];
document.getElementById("speedTCP").innerHTML = `Phone: ${speedTCPkmh.toFixed(1)} km/h` document.getElementById("speedTCP").innerHTML = `Phone: ${speedTCPkmh.toFixed(1)} km/h`
mySpeedometer.update(); mySpeedometer.update();
} }

144
static/scripts/websocket.js
View File

@ -1,19 +1,17 @@
const GRAPH_RES = 100; let tempTCPCoords = null;
var dataSmartphone = []; let tempSERIALCoords = null;
var tempTCPCoords = null; let tempDist = 0;
var tempSERIALCoords = null;
var tempDist = 0;
window.addEventListener("load", function(evt) { window.addEventListener("load", function(evt) {
var output = document.getElementById("output"); let output = document.getElementById("output");
var checkBoxSmartphone = document.getElementById("checkbox1"); let checkBoxSmartphone = document.getElementById("checkbox1");
var checkBoxUblox = document.getElementById("checkbox2"); let checkBoxUblox = document.getElementById("checkbox2");
var ws; let ws;
const wsOnCloseF = function (evt) { const wsOnCloseF = function (evt) {
ws = null; ws = null;
print2("CLOSED"); print2("CLOSED");
var intervalId; let intervalId;
intervalId = setInterval(() => { intervalId = setInterval(() => {
console.log("reconnect websocket...") console.log("reconnect websocket...")
if (ws !== null && ws.CONNECTING) { if (ws !== null && ws.CONNECTING) {
@ -31,79 +29,66 @@ window.addEventListener("load", function(evt) {
}, 1000) }, 1000)
} }
const wsOnMessageF = function (evt) { const wsOnMessageF = function (evt) {
let dat = JSON.parse(evt.data)
// console.log(dat)
if ('SOURCE_TCP' in dat) { if ('SOURCE_TCP' in dat) {
setIndicatorsTcp(dat.SOURCE_TCP) setIndicatorsTcp(dat.SOURCE_TCP)
} if(dat.SOURCE_TCP.Orientation[0] !== 0 && dat.SOURCE_TCP.Orientation[1] !== 0 && dat.SOURCE_TCP.Orientation[2] !== 0){
try{ let heading = (dat.SOURCE_TCP.Orientation[2]+90)%360
if(!(dat.SOURCE_TCP.Orientation[0] === 0) && !(dat.SOURCE_TCP.Orientation[1] === 0) && !(dat.SOURCE_TCP.Orientation[2] === 0)){
let heading = (dat.SOURCE_TCP.Orientation[2]+90)%360 // dat.SOURCE_TCP.Orientation[2] //
// if (dat.SOURCE_TCP.HeadDevice !== 0) { heading = dat.SOURCE_TCP.HeadDevice; }
// if (dat.SOURCE_TCP.HeadMotion !== 0) { heading = dat.SOURCE_TCP.HeadMotion; console.log("head motion") }
renderTCP((dat.SOURCE_TCP.Orientation[0]*Math.PI/180),heading*Math.PI/180,-(dat.SOURCE_TCP.Orientation[1]*Math.PI/180)) renderTCP((dat.SOURCE_TCP.Orientation[0]*Math.PI/180),heading*Math.PI/180,-(dat.SOURCE_TCP.Orientation[1]*Math.PI/180))
} }
if(!(dat.SOURCE_TCP.Position[1] === 0) && !(dat.SOURCE_TCP.Position[0] === 0)){ if(dat.SOURCE_TCP.Position[1] !== 0 && dat.SOURCE_TCP.Position[0] !== 0){
document.getElementById("TCPlong").innerHTML = "Smartphone long: " + dat.SOURCE_TCP.Position[1] document.getElementById("TCPlong").innerHTML = "Smartphone long: " + dat.SOURCE_TCP.Position[1]
document.getElementById("TCPlat").innerHTML = "Smartphone lat: " + dat.SOURCE_TCP.Position[0] document.getElementById("TCPlat").innerHTML = "Smartphone lat: " + dat.SOURCE_TCP.Position[0]
updateMapTCP(dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]) updateMapTCP(dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0])
map.panTo([dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]]) map.panTo([dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]])
tempTCPCoords = [dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]] tempTCPCoords = [dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]]
} }
if(!(dat.SOURCE_TCP.Speed === 0)){ if(dat.SOURCE_TCP.Speed !== 0){
addSpeedTcp(dat.SOURCE_TCP.Speed); addSpeedTcp(dat.SOURCE_TCP.Speed);
} }
if(!(dat.SOURCE_TCP.HeadDevice === 0)){ if(dat.SOURCE_TCP.HeadDevice !== 0){
document.getElementById("compassTCP").innerHTML = " Heading Device: " + dat.SOURCE_TCP.HeadDevice.toFixed(2) + "°" document.getElementById("compassTCP").innerHTML = " Heading Device: " + dat.SOURCE_TCP.HeadDevice.toFixed(2) + "°"
// document.getElementById("needleTCP").style.transform = `rotate(${dat.SOURCE_TCP.HeadDevice}deg)`
} }
if(!(dat.SOURCE_TCP.HeadMotion === 0)) { if(dat.SOURCE_TCP.HeadMotion !== 0) {
document.getElementById("compassTCPMot").innerHTML = "Heading Motion: " + dat.SOURCE_TCP.HeadMotion.toFixed(2) + "°" document.getElementById("compassTCPMot").innerHTML = "Heading Motion: " + dat.SOURCE_TCP.HeadMotion.toFixed(2) + "°"
} }
if(dat.SOURCE_TCP.HAcc !== 0 && dat.SOURCE_TCP.VAcc !== 0){
addTCPAccuracy(dat.SOURCE_TCP.HAcc, dat.SOURCE_TCP.VAcc)
document.getElementById("tcpHAcc").innerHTML = "Phone HAcc: " + dat.SOURCE_TCP.HAcc.toFixed(2) + " m"
document.getElementById("tcpVAcc").innerHTML = "Phone VAcc: " + dat.SOURCE_TCP.VAcc.toFixed(2) + " m"
}
}
}
catch{
// console.log("no TCP data")
}
if ('SOURCE_SERIAL' in dat) { if ('SOURCE_SERIAL' in dat) {
setIndicatorsSer(dat.SOURCE_SERIAL) setIndicatorsSer(dat.SOURCE_SERIAL)
} if(dat.SOURCE_SERIAL.Orientation[0] !== 0 && dat.SOURCE_SERIAL.Orientation[2] !== 0){
try{
if(!(dat.SOURCE_SERIAL.Orientation[0] === 0) && /*!(dat.SOURCE_SERIAL.Orientation[1] === 0) &&*/ !(dat.SOURCE_SERIAL.Orientation[2] === 0)){
// document.getElementById("gyroscopeSERIAL").style.transform = `rotateX(${dat.SOURCE_SERIAL.Orientation[0]}deg) rotateY(${dat.SOURCE_SERIAL.Orientation[1]}deg) rotateZ(0deg)`
// document.getElementById("gyroscopeSERIAL").style.transform = `rotateX(${dat.SOURCE_SERIAL.Orientation[0]}deg) rotateY(${dat.SOURCE_SERIAL.Orientation[1]}deg) rotateZ(${dat.SOURCE_SERIAL.Orientation[2]}deg)`
renderSerial(dat.SOURCE_SERIAL.Orientation[0]*Math.PI/180,-dat.SOURCE_SERIAL.Orientation[2]*Math.PI/180,dat.SOURCE_SERIAL.Orientation[1]*Math.PI/180) renderSerial(dat.SOURCE_SERIAL.Orientation[0]*Math.PI/180,-dat.SOURCE_SERIAL.Orientation[2]*Math.PI/180,dat.SOURCE_SERIAL.Orientation[1]*Math.PI/180)
} }
if(!(dat.SOURCE_SERIAL.Position[1] === 0) && !(dat.SOURCE_SERIAL.Position[0] === 0)){ if(dat.SOURCE_SERIAL.Position[1] !== 0 && dat.SOURCE_SERIAL.Position[0] !== 0){
document.getElementById("SERIALlong").innerHTML = "Ublox long: " + dat.SOURCE_SERIAL.Position[1] document.getElementById("SERIALlong").innerHTML = "Ublox long: " + dat.SOURCE_SERIAL.Position[1]
document.getElementById("SERIALlat").innerHTML = "Ublox lat: " + dat.SOURCE_SERIAL.Position[0] document.getElementById("SERIALlat").innerHTML = "Ublox lat: " + dat.SOURCE_SERIAL.Position[0]
updateMapSERIAL(dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]) updateMapSERIAL(dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0])
map.panTo([dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]]) map.panTo([dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]])
tempSERIALCoords = [dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]] tempSERIALCoords = [dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]]
if (!(tempTCPCoords == null)) { if (tempTCPCoords !== null) {
console.log("tcp: " + tempTCPCoords) let long1 = tempTCPCoords[0]
console.log("serial: " + tempSERIALCoords) let lat1 = tempTCPCoords[1]
let long2 = tempSERIALCoords[0]
let lat2 = tempSERIALCoords[1]
var long1 = tempTCPCoords[0] let earthRadiusM = 6371000
var lat1 = tempTCPCoords[1]
var long2 = tempSERIALCoords[0]
var lat2 = tempSERIALCoords[1]
var earthRadiusM = 6371000 let phi1 = lat1 * Math.PI / 180
let phi2 = lat2 * Math.PI / 180
var phi1 = lat1 * Math.PI / 180 let dlat = (lat2-lat1) * Math.PI / 180
var phi2 = lat2 * Math.PI / 180 let dlong = (long2 - long1) * Math.PI / 180
var dlat = (lat2-lat1) * Math.PI / 180 let a = Math.sin(dlat/2) * Math.sin(dlat/2) +
var dlong = (long2 - long1) * Math.PI / 180
var a = Math.sin(dlat/2) * Math.sin(dlat/2) +
Math.cos(phi1) * Math.cos(phi2) * Math.cos(phi1) * Math.cos(phi2) *
Math.sin(dlong/2) * Math.sin(dlong/2) Math.sin(dlong/2) * Math.sin(dlong/2)
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)) let c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a))
tempDist = (earthRadiusM * c).toFixed(3) tempDist = (earthRadiusM * c).toFixed(3)
console.log("Dist: " + tempDist)
addDistanceToBarChart(tempDist) addDistanceToBarChart(tempDist)
document.getElementById("distance").innerHTML = "Distance: " + tempDist document.getElementById("distance").innerHTML = "Distance: " + tempDist
@ -118,46 +103,22 @@ window.addEventListener("load", function(evt) {
} }
tempTCPCoords = null tempTCPCoords = null
} }
if(!(dat.SOURCE_SERIAL.Speed === 0)){ if(dat.SOURCE_SERIAL.Speed !== 0){
addSpeedSerial(dat.SOURCE_SERIAL.Speed); addSpeedSerial(dat.SOURCE_SERIAL.Speed);
} }
if(!(dat.SOURCE_SERIAL.HeadDevice === 0)){ if(dat.SOURCE_SERIAL.HeadDevice !== 0){
document.getElementById("compassSERIAL").innerHTML = "Heading Device: " + dat.SOURCE_SERIAL.HeadDevice.toFixed(2) + "°" document.getElementById("compassSERIAL").innerHTML = "Heading Device: " + dat.SOURCE_SERIAL.HeadDevice.toFixed(2) + "°"
// document.getElementById("needle").style.transform = `rotate(${dat.SOURCE_SERIAL.HeadDevice}deg)`
} }
if(!(dat.SOURCE_SERIAL.HeadMotion === 0)) { if(dat.SOURCE_SERIAL.HeadMotion !== 0) {
document.getElementById("compassSERIALMot").innerHTML = "Heading Motion: " + dat.SOURCE_SERIAL.HeadMotion.toFixed(2) + "°" document.getElementById("compassSERIALMot").innerHTML = "Heading Motion: " + dat.SOURCE_SERIAL.HeadMotion.toFixed(2) + "°"
} }
}catch{ if(dat.SOURCE_SERIAL.HAcc !== 0 && dat.SOURCE_SERIAL.VAcc !== 0){
// console.log("no serial data")
}
try{
if(!(dat.SOURCE_SERIAL.HAcc === 0) && !(dat.SOURCE_SERIAL.VAcc === 0)){
addSerialAccuracy(dat.SOURCE_SERIAL.HAcc, dat.SOURCE_SERIAL.VAcc) addSerialAccuracy(dat.SOURCE_SERIAL.HAcc, dat.SOURCE_SERIAL.VAcc)
document.getElementById("serialHAcc").innerHTML = "Ublox HAcc: " + dat.SOURCE_SERIAL.HAcc.toFixed(3) + " m" document.getElementById("serialHAcc").innerHTML = "Ublox HAcc: " + dat.SOURCE_SERIAL.HAcc.toFixed(3) + " m"
document.getElementById("serialVAcc").innerHTML = "Ublox VAcc: " + dat.SOURCE_SERIAL.VAcc.toFixed(2) + " m" document.getElementById("serialVAcc").innerHTML = "Ublox VAcc: " + dat.SOURCE_SERIAL.VAcc.toFixed(2) + " m"
//console.log("acc: " + dat.SOURCE_SERIAL.HAcc, dat.SOURCE_SERIAL.VAcc)
} }
} }
catch{
// console.log("no Serial acc")
}
try{
if(!(dat.SOURCE_TCP.HAcc === 0) && !(dat.SOURCE_TCP.VAcc === 0)){
addTCPAccuracy(dat.SOURCE_TCP.HAcc, dat.SOURCE_TCP.VAcc)
document.getElementById("tcpHAcc").innerHTML = "Phone HAcc: " + dat.SOURCE_TCP.HAcc.toFixed(2) + " m"
document.getElementById("tcpVAcc").innerHTML = "Phone VAcc: " + dat.SOURCE_TCP.VAcc.toFixed(2) + " m"
console.log("acc: " + dat.SOURCE_TCP.HAcc, dat.SOURCE_TCP.VAcc)
}
}
catch{
console.log("no TCP acc")
}
} }
const wsOnOpenF = function (evt) { const wsOnOpenF = function (evt) {
print2("OPEN"); print2("OPEN");
@ -167,48 +128,35 @@ window.addEventListener("load", function(evt) {
print2("ERROR: " + evt); print2("ERROR: " + evt);
} }
ws = new WebSocket("ws://localhost:3011/ws"); ws = new WebSocket("ws://localhost:3011/ws");
ws.onopen = wsOnOpenF ws.onopen = wsOnOpenF
ws.onclose = wsOnCloseF ws.onclose = wsOnCloseF
ws.onmessage = wsOnMessageF ws.onmessage = wsOnMessageF
ws.onerror = wsOnErrorF ws.onerror = wsOnErrorF
const print2 = function(message) {
let d = document.createElement("p");
var print = function(message) {
var d = document.createElement("div");
d.textContent = message;
output.appendChild(d);
};
var print2 = function(message) {
var d = document.createElement("p");
d.innerText = message; d.innerText = message;
oldNode = output.firstChild oldNode = output.firstChild
output.replaceChild(d, oldNode) output.replaceChild(d, oldNode)
}; };
document.getElementById("open").onclick = function(evt) { document.getElementById("open").onclick = function(evt) {
// if (ws && ws.OPEN) {
// print2("Websocket already open")
// return false;
// }
if(checkBoxSmartphone.checked && checkBoxUblox.checked){ if(checkBoxSmartphone.checked && checkBoxUblox.checked){
fetch('http://localhost:3011/trackings?serial=true&tcp=true', { method: 'POST', body: 'some test data'}) fetch('http://localhost:3011/trackings?serial=true&tcp=true', { method: 'POST', body: 'some test data'})
.then(results => results.json()) .then(results => results.json())
.then(console.log); .then(console.log);
} }
else if(!(checkBoxSmartphone.checked) && checkBoxUblox.checked){ else if(!checkBoxSmartphone.checked && checkBoxUblox.checked){
fetch('http://localhost:3011/trackings?serial=true&tcp=false', { method: 'POST', body: 'some test data'}) fetch('http://localhost:3011/trackings?serial=true&tcp=false', { method: 'POST', body: 'some test data'})
.then(results => results.json()) .then(results => results.json())
.then(console.log); .then(console.log);
} }
else if(checkBoxSmartphone.checked && !(checkBoxUblox.checked)){ else if(checkBoxSmartphone.checked && !checkBoxUblox.checked){
fetch('http://localhost:3011/trackings?serial=false&tcp=true', { method: 'POST', body: 'some test data'}) fetch('http://localhost:3011/trackings?serial=false&tcp=true', { method: 'POST', body: 'some test data'})
.then(results => results.json()) .then(results => results.json())
.then(console.log); .then(console.log);
} }
else if(!(checkBoxSmartphone.checked) && !(checkBoxUblox.checked)){ else if(!checkBoxSmartphone.checked && !checkBoxUblox.checked){
fetch('http://localhost:3011/trackings?serial=false&tcp=false', { method: 'POST', body: 'some test data'}) fetch('http://localhost:3011/trackings?serial=false&tcp=false', { method: 'POST', body: 'some test data'})
.then(results => results.json()) .then(results => results.json())
.then(console.log); .then(console.log);
@ -259,10 +207,10 @@ window.addEventListener("load", function(evt) {
checkBoxSmartphone.disabled = false; checkBoxSmartphone.disabled = false;
checkBoxUblox.disabled = false; checkBoxUblox.disabled = false;
document.getElementById("tracking state").innerHTML = "Tracking state: CLOSED" document.getElementById("tracking state").innerHTML = "Tracking state: CLOSED"
//ws.close();
} }
return false; return false;
}; };
var trackings = null; var trackings = null;
document.getElementById("messungladen").onclick = function(evt) { document.getElementById("messungladen").onclick = function(evt) {
fetch('http://localhost:3011/trackings/', { method: 'GET'}).then(results => { fetch('http://localhost:3011/trackings/', { method: 'GET'}).then(results => {
@ -277,7 +225,7 @@ window.addEventListener("load", function(evt) {
r.data.sort((a,b) => new Date(b.TimeCreated).getTime() - new Date(a.TimeCreated).getTime()); r.data.sort((a,b) => new Date(b.TimeCreated).getTime() - new Date(a.TimeCreated).getTime());
r.data.forEach(tracking => { r.data.forEach(tracking => {
console.log(tracking) console.log(tracking)
var option = document.createElement("option"); let option = document.createElement("option");
option.text = tracking.TimeCreated + " Size: " + tracking.Size option.text = tracking.TimeCreated + " Size: " + tracking.Size
sel.add(option) sel.add(option)
}) })

27
templates/index.html
View File

@ -124,32 +124,6 @@
<div class="float-child right-col"> <div class="float-child right-col">
<div class="compass-container"> <div class="compass-container">
<!-- <div id="compass">-->
<!-- <div id="bezel"></div>-->
<!-- <div id="NWSE" class="quad"></div>-->
<!-- <div id="NESW" class="quad"></div>-->
<!-- <div id="NS" class="quad"></div>-->
<!-- <div id="WE" class="quad"></div>-->
<!-- <span id="N" class="dir">N</span>-->
<!-- <span id="E" class="dir">O</span>-->
<!-- <span id="S" class="dir">S</span>-->
<!-- <span id="W" class="dir">W</span>-->
<!-- <div id="needle"></div>-->
<!-- <div id="axis"></div>-->
<!-- </div>-->
<!-- <div id="compass1">-->
<!-- <div id="bezelTCP"></div>-->
<!-- <div id="NWSETCP" class="quad"></div>-->
<!-- <div id="NESWTCP" class="quad"></div>-->
<!-- <div id="NSTCP" class="quad"></div>-->
<!-- <div id="WETCP" class="quad"></div>-->
<!-- <span id="NTCP" class="dir">N</span>-->
<!-- <span id="ETCP" class="dir">O</span>-->
<!-- <span id="STCP" class="dir">S</span>-->
<!-- <span id="WTCP" class="dir">W</span>-->
<!-- <div id="needleTCP"></div>-->
<!-- <div id="axisTCP"></div>-->
<!-- </div>-->
<label id="airspeedLabel" <label id="airspeedLabel"
style="display:inline-block; width: 200px; margin-right: 0; color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Ref. Speed:</label> style="display:inline-block; width: 200px; margin-right: 0; color: rgba(214, 69, 65, 1); font: 15px 'Helvetica Neue', Arial, Helvetica, sans-serif">Ref. Speed:</label>
<label id="altitudeLabel" <label id="altitudeLabel"
@ -172,7 +146,6 @@
<span id="headingTcp"></span> <span id="headingTcp"></span>
<span id="attitudeSer"></span> <span id="attitudeSer"></span>
<span id="attitudeTcp"></span> <span id="attitudeTcp"></span>
<!-- <span id="variometer"></span>-->
<div> <div>
<div id="viewport"> <div id="viewport">