add chart that shows tcp and serial speed over time

This commit is contained in:
unknown 2021-01-07 09:38:54 +01:00
parent c3f9240801
commit 4a21d4edfa
3 changed files with 88 additions and 40 deletions

View File

@ -1,3 +1,30 @@
/*var tcpServertimesSpeedsPos = {
data: [
{
dataset: {
times: [],
speeds: [],
positions: []
}
}
]
}
var serialServertimesSpeedsPos = {
data: [
{
dataset: {
times: [],
speeds: [],
positions: []
}
}
]
}*/
let allSpeedsSerial = []
let indexes = []
var arrayTCP = [];
var arraySERIAL = [];
@ -12,7 +39,7 @@ var myChart = new Chart(ctx, {
borderColor: 'rgba(214, 69, 65, 1)',
borderWidth: 1,
fill: false,
pointRadius: 0,
pointRadius: 1,
lineTension: 0.5,
data: arraySERIAL
},
@ -22,7 +49,7 @@ var myChart = new Chart(ctx, {
borderColor: 'rgba(30, 139, 195, 1)',
borderWidth: 1,
fill: false,
pointRadius: 0,
pointRadius: 1,
lineTension: 0.5,
data: arrayTCP
}]
@ -32,7 +59,8 @@ var myChart = new Chart(ctx, {
yAxes: [{
ticks: {
min: 0,
max: 250
max: 250,
stepSize: 25
}
}],
xAxes: [{
@ -50,27 +78,13 @@ var myChart = new Chart(ctx, {
//myChart.data.labels.fill("", 0, GRAPH_RES);
//myChart.data.datasets.forEach((dataset) => dataset.data.fill(0, 0, GRAPH_RES))
function addSerialSpeedData(serialdataList, tcpdataList) {
let speedsSerial = []
let times = []
serialdataList.forEach(sensordata => {
if (sensordata.Speed === 0) {
return;
}
let speed = sensordata.Speed
speedsSerial.push(speed * 3.6, timestamp);
let time = sensordata.Servertime
times.push(time)
function addSerialSpeedData() {
let speeds = []
indexes.forEach(index => {
speeds.push((allSpeedsSerial[index].toFixed(2) * 3.6 * 3.6))
})
myChart.data.labels = times;
myChart.data.datasets[0].data = speedsSerial;
/*while (myChart.data.labels.length >= GRAPH_RES) {
myChart.data.labels.shift();
myChart.data.datasets.forEach((dataset) => dataset.data.shift())
}*/
myChart.data.datasets[0].data = speeds;
myChart.update();
};
@ -83,12 +97,12 @@ function addTCPSpeedData(sensordataList) {
return;
}
let speed = sensordata.Speed
speedsTCP.push(speed);
speedsTCP.push(speed * 3.6);
let time = sensordata.Servertime
times.push(time)
})
//myChart.data.labels = times;
myChart.data.labels = times;
myChart.data.datasets[1].data = speedsTCP;
/*while (myChart.data.labels.length >= GRAPH_RES) {
@ -97,3 +111,26 @@ function addTCPSpeedData(sensordataList) {
}*/
myChart.update();
};
function findSerialDataIndex(tcpdataList, serialdataList) {
let allSerialTimes = []
serialdataList.forEach(sensordata => {
if (!(sensordata.Speed === 0)) {
let serialTimestamp;
allSpeedsSerial.push(sensordata.Speed)
serialTimestamp = composeServertime(sensordata.Servertime)
allSerialTimes.push(serialTimestamp)
}
})
tcpdataList.forEach(sensordata => {
if (!(sensordata.Speed === 0)) {
let tcpTimestamp = composeServertime(sensordata.Servertime)
let index = findBestTimeMatch(tcpTimestamp, allSerialTimes)[1]
indexes.push(index)
}
})
console.log("indexes: " + indexes)
};

View File

@ -1,5 +1,29 @@
var trackingdata = null;
function composeServertime(servertime){
var composed;
composed = servertime.slice(11,25).split(':').join("").split('.').join("");
return composed;
}
function findBestTimeMatch(num, arr) {
var mid;
var lo = 0;
var hi = arr.length - 1;
while (hi - lo > 1) {
mid = Math.floor ((lo + hi) / 2);
if (arr[mid] < num) {
lo = mid;
} else {
hi = mid;
}
}
if (num - arr[lo] <= arr[hi] - num) {
return [arr[lo], lo];
}
return [arr[hi], hi];
}
window.addEventListener("load", function(evt) {
//------------------------Buttons------------------------------
@ -35,13 +59,14 @@ window.addEventListener("load", function(evt) {
}).then(r => {
console.log(r.data.Data)
console.log(r.data)
findSerialDataIndex(r.data.Data.SOURCE_TCP, r.data.Data.SOURCE_SERIAL)
if ('SOURCE_TCP' in r.data.Data && r.data.Data.SOURCE_TCP.length > 0) {
updateMapTCPbulk(r.data.Data.SOURCE_TCP)
addTCPSpeedData(r.data.Data.SOURCE_TCP)
}
if ('SOURCE_SERIAL' in r.data.Data && r.data.Data.SOURCE_SERIAL.length > 0) {
updateMapSERIALbulk(r.data.Data.SOURCE_SERIAL)
addSerialSpeedData(r.data.Data.SOURCE_SERIAL, r.data.Data.SOURCE_TCP)
addSerialSpeedData()
}
})

View File

@ -22,7 +22,6 @@ window.addEventListener("load", function(evt) {
dataSmartphone.push(dat)
//console.log(evt.data)
console.log("JSON geparsed onmessage", dat)
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)`
@ -40,6 +39,7 @@ window.addEventListener("load", function(evt) {
document.getElementById("compassTCP").innerHTML = "Smartphone: <br>" + dat.SOURCE_TCP.HeadDevice.toFixed(0) + "°"
document.getElementById("needleTCP").style.transform = `rotate(${dat.SOURCE_TCP.HeadDevice}deg)`
}
}
catch{
console.log("no TCP data")
@ -108,20 +108,6 @@ window.addEventListener("load", function(evt) {
catch{
console.log("no TCP acc")
}
/*
console.log(dat)
orientation[0] += dat[0] * multiplier
orientation[1] += dat[1] * multiplier
orientation[2] += dat[2] * multiplier
// dataset.push(orientation[0])
// while (dataset.length >= 50) {
// dataset.shift();
// }
// addData(orientation[0] / multiplier)
*/
}
ws.onerror = function(evt) {