diff --git a/static/scripts/compass.js b/static/scripts/compass.js
index c411087..329f354 100644
--- a/static/scripts/compass.js
+++ b/static/scripts/compass.js
@@ -4,16 +4,12 @@ var options2 = {
datasets: [
{
label: 'compassTCP',
- data: [50,50,50,50],
+ data: [360,0],
backgroundColor: [
- 'rgba(191, 191, 191, 1)',
- 'rgba(191, 191, 191, 1)',
'rgba(30, 139, 195, 1)',
'rgba(30, 139, 195, 1)'
],
borderColor: [
- 'rgba(255, 255, 255 ,1)',
- 'rgba(255, 255, 255 ,1)',
'rgba(255, 255, 255 ,1)',
'rgba(255, 255, 255 ,1)'
],
@@ -21,16 +17,12 @@ var options2 = {
},
{
label: 'compassSERIAL',
- data: [50,50,50,50],
+ data: [360,0],
backgroundColor: [
- 'rgba(191, 191, 191, 1)',
- 'rgba(191, 191, 191, 1)',
'rgba(214, 69, 65, 1)',
- 'rgba(214, 69, 65, 1)'
+ 'rgba(214, 69, 65, 1)',
],
borderColor: [
- 'rgba(255, 255, 255 ,1)',
- 'rgba(255, 255, 255 ,1)',
'rgba(255, 255, 255 ,1)',
'rgba(255, 255, 255 ,1)'
],
@@ -58,6 +50,23 @@ var myCompass = new Chart(ctx2, options2);
function addCompassSerial(deg){
- myCompass.data.datasets[1].data = [0,0,0,0];
+ var c = Math.abs(90-deg);
+ if(deg<90){
+ myCompass.data.datasets[1].data = [360-c,c];
+ }
+ if(deg>90){
+ myCompass.data.datasets[1].data = [c,360-c];
+ }
+ myCompass.update();
+}
+
+function addCompassTCP(deg){
+ var c = Math.abs(90-deg);
+ if(deg<90){
+ myCompass.data.datasets[0].data = [360-c,c];
+ }
+ if(deg>90){
+ myCompass.data.datasets[0].data = [c,360-c];
+ }
myCompass.update();
}
diff --git a/static/scripts/websocket.js b/static/scripts/websocket.js
index 849d51a..8f1575c 100644
--- a/static/scripts/websocket.js
+++ b/static/scripts/websocket.js
@@ -69,11 +69,6 @@ window.addEventListener("load", function(evt) {
//console.log(evt.data)
console.log("JSON geparsed onmessage", dat)
- if(!(dat.SOURCE_SERIAL.HeadDevice === 0)){
- console.log("Compass" + dat.SOURCE_SERIAL.HeadDevice)
- addCompassSerial(dat.SOURCE_SERIAL.HeadDevice)
- }
-
try{
if(!(dat.SOURCE_TCP.Orientation[0] === 0) && !(dat.SOURCE_TCP.Orientation[1] === 0) && !(dat.SOURCE_TCP.Orientation[2] === 0)){
document.getElementById("gyroscopeTCP").style.transform = `rotateX(${dat.SOURCE_TCP.Orientation[0]}deg) rotateY(${dat.SOURCE_TCP.Orientation[1]}deg) rotateZ(${dat.SOURCE_TCP.Orientation[2]}deg)`
@@ -84,7 +79,13 @@ window.addEventListener("load", function(evt) {
updateMapTCP(dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0])
map.panTo([dat.SOURCE_TCP.Position[1], dat.SOURCE_TCP.Position[0]])
}
- addSpeedTcp(dat.SOURCE_TCP.Speed);
+ if(!(dat.SOURCE_TCP.Speed === 0)){
+ addSpeedTcp(dat.SOURCE_TCP.Speed);
+ }
+ if(!(dat.SOURCE_TCP.HeadDevice === 0)){
+ addCompassTCP(dat.SOURCE_TCP.HeadDevice)
+ document.getElementById("compassTCP").innerHTML = "Smartphone: " + dat.SOURCE_TCP.HeadDevice.toFixed(0) + "°"
+ }
}
catch{
console.log("no TCP data")
@@ -100,7 +101,13 @@ window.addEventListener("load", function(evt) {
updateMapSERIAL(dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0])
map.panTo([dat.SOURCE_SERIAL.Position[1], dat.SOURCE_SERIAL.Position[0]])
}
- addSpeedSerial(dat.SOURCE_SERIAL.Speed);
+ if(!(dat.SOURCE_SERIAL.Speed === 0)){
+ addSpeedSerial(dat.SOURCE_SERIAL.Speed);
+ }
+ if(!(dat.SOURCE_SERIAL.HeadDevice === 0)){
+ addCompassSerial(dat.SOURCE_SERIAL.HeadDevice)
+ document.getElementById("compassSERIAL").innerHTML = "Ublox: " + dat.SOURCE_SERIAL.HeadDevice.toFixed(0) + "°"
+ }
}catch{
console.log("no serial data")
}
diff --git a/templates/index.html b/templates/index.html
index 816fdd6..e05a410 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -63,6 +63,14 @@
bottom: 0;
margin-bottom: -50px;
}
+ .speedMed {
+ position: absolute;
+ left: 50%;
+ transform: translate(-50%, 0);
+ font-size: 30px;
+ bottom: 0;
+ margin-bottom: 150px;
+ }
.speedMax {
position: absolute;
Left: 100%;
@@ -225,9 +233,12 @@
-
-
0
-
250
+