adds JSDoc to some functions and to file headers
This commit is contained in:
parent
f6ca896691
commit
f45cea959d
@ -1,6 +1,12 @@
|
|||||||
let allAccSerial = []
|
/**
|
||||||
let allSerialCoords = []
|
* This file defines a line chart used in the full replay page, showing Ublox horizontal accuracy,
|
||||||
|
* smartphone horizontal accuracy and distance between the positions of the Ublox
|
||||||
|
* and the Smartphone at a same time in meters, over time.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
|
//Defines the chart and its properties
|
||||||
let ctx = document.getElementById('accChart').getContext('2d');
|
let ctx = document.getElementById('accChart').getContext('2d');
|
||||||
let accChart = new Chart(ctx, {
|
let accChart = new Chart(ctx, {
|
||||||
type: 'line',
|
type: 'line',
|
||||||
@ -58,14 +64,20 @@ let accChart = new Chart(ctx, {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to calculate the distance between to coordinates at a same time using the vincenty algorithm.
|
||||||
|
*
|
||||||
|
* @param data all collected data.
|
||||||
|
*/
|
||||||
function addDistances(data){
|
function addDistances(data){
|
||||||
|
//collect all horizontal accuracies from serial source and tcp source.
|
||||||
let serialHAccs = data.map(el => {
|
let serialHAccs = data.map(el => {
|
||||||
return el.ser.HAcc
|
return el.ser.HAcc
|
||||||
})
|
})
|
||||||
let tcpHAccs = data.map(el => {
|
let tcpHAccs = data.map(el => {
|
||||||
return el.tcp.HAcc
|
return el.tcp.HAcc
|
||||||
})
|
})
|
||||||
|
//apply vincenty algorithm on coordinates from serial and tcp source.
|
||||||
let distances = data.map((el, i, arr) => {
|
let distances = data.map((el, i, arr) => {
|
||||||
// return distVincenty(el.ser.Position, el.tcp.Position)
|
// return distVincenty(el.ser.Position, el.tcp.Position)
|
||||||
const plaindist = distVincenty(el.ser.Position, el.tcp.Position)
|
const plaindist = distVincenty(el.ser.Position, el.tcp.Position)
|
||||||
@ -79,6 +91,7 @@ function addDistances(data){
|
|||||||
return el.tcp.Timestamp
|
return el.tcp.Timestamp
|
||||||
})
|
})
|
||||||
|
|
||||||
|
//add the data to the chart and update the hart
|
||||||
accChart.data.labels = tcpTimes
|
accChart.data.labels = tcpTimes
|
||||||
accChart.data.datasets[0].data = serialHAccs
|
accChart.data.datasets[0].data = serialHAccs
|
||||||
accChart.data.datasets[1].data = tcpHAccs
|
accChart.data.datasets[1].data = tcpHAccs
|
||||||
@ -86,6 +99,12 @@ function addDistances(data){
|
|||||||
accChart.update()
|
accChart.update()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to calculate distance between two coordinates using the haversine algorithm (less precise).
|
||||||
|
* @param coord1 first set of coordinates.
|
||||||
|
* @param coord2 second set of coordinates.
|
||||||
|
* @returns {number} distance between the two points in meters.
|
||||||
|
*/
|
||||||
function distanceInMetersBetweenEarthCoordinates(coord1, coord2) {
|
function distanceInMetersBetweenEarthCoordinates(coord1, coord2) {
|
||||||
let long1 = coord1[0]
|
let long1 = coord1[0]
|
||||||
let lat1 = coord1[1]
|
let lat1 = coord1[1]
|
||||||
@ -110,6 +129,12 @@ function distanceInMetersBetweenEarthCoordinates(coord1, coord2) {
|
|||||||
|
|
||||||
Number.prototype.toRad = function () { return this * Math.PI / 180; }
|
Number.prototype.toRad = function () { return this * Math.PI / 180; }
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to calculate distance between two coordinates using the vincenty algorithm (more precise).
|
||||||
|
* @param coord1 first set of coordinates.
|
||||||
|
* @param coord2 second set of coordinates.
|
||||||
|
* @returns {string|number} distance between the two point is meters.
|
||||||
|
*/
|
||||||
function distVincenty(coord1, coord2) {
|
function distVincenty(coord1, coord2) {
|
||||||
const lon1 = coord1[0]
|
const lon1 = coord1[0]
|
||||||
const lat1 = coord1[1]
|
const lat1 = coord1[1]
|
||||||
|
|||||||
@ -1,5 +1,14 @@
|
|||||||
var ctx = document.getElementById("accuracy").getContext('2d');
|
/**
|
||||||
var barChart = new Chart(ctx, {
|
* This file defines an horizontal bar chart used in the live tracking page, showing Ublox horizontal accuracy,
|
||||||
|
* smartphone horizontal accuracy and distance between the positions of the Ublox
|
||||||
|
* and the Smartphone at a same time in meters.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
|
//Defines the chart and its properties.
|
||||||
|
let ctx = document.getElementById("accuracy").getContext('2d');
|
||||||
|
let barChart = new Chart(ctx, {
|
||||||
type: 'horizontalBar',
|
type: 'horizontalBar',
|
||||||
data: {
|
data: {
|
||||||
labels: ["Meters"],
|
labels: ["Meters"],
|
||||||
@ -37,16 +46,33 @@ var barChart = new Chart(ctx, {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to add the Horizontal and Vertical accuracy sent by the Ublox to the chart.
|
||||||
|
* Called every time a message is received over serial connection from the server.
|
||||||
|
* @param hacc horizontal accuracy in meters.
|
||||||
|
* @param vacc vertical accuracy in meters
|
||||||
|
*/
|
||||||
function addSerialAccuracy(hacc, vacc){
|
function addSerialAccuracy(hacc, vacc){
|
||||||
barChart.data.datasets[0].data = [hacc, vacc];
|
barChart.data.datasets[0].data = [hacc, vacc];
|
||||||
barChart.update();
|
barChart.update();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to add the Horizontal and Vertical accuracy sent by the Smartphone to the chart.
|
||||||
|
* Called every time a message is received over tcp connection from the server.
|
||||||
|
* @param hacc horizontal accuracy in meters.
|
||||||
|
* @param vacc vertical accuracy in meters
|
||||||
|
*/
|
||||||
function addTCPAccuracy(hacc, vacc){
|
function addTCPAccuracy(hacc, vacc){
|
||||||
barChart.data.datasets[1].data = [hacc, vacc];
|
barChart.data.datasets[1].data = [hacc, vacc];
|
||||||
barChart.update();
|
barChart.update();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to add the calculated distance between coordinates sent by the Ublox and the coordinates
|
||||||
|
* sent by the smartphone to the chart.
|
||||||
|
* @param dist distance calculated in meters.
|
||||||
|
*/
|
||||||
function addDistanceToBarChart(dist){
|
function addDistanceToBarChart(dist){
|
||||||
barChart.data.datasets[2].data = [dist];
|
barChart.data.datasets[2].data = [dist];
|
||||||
barChart.update();
|
barChart.update();
|
||||||
|
|||||||
@ -1,9 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* This file defines the map in satellite style for the live tracking page, defines and updates its data sources.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
|
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
|
||||||
let 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
|
||||||
});
|
});
|
||||||
|
|
||||||
|
//Empty geoJSON for coordinates from TCP input
|
||||||
let emptyTCP = {
|
let emptyTCP = {
|
||||||
type: "FeatureCollection",
|
type: "FeatureCollection",
|
||||||
features: [
|
features: [
|
||||||
@ -15,7 +23,7 @@ let emptyTCP = {
|
|||||||
}
|
}
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
|
//Empty geoJSON for coordinates from serial input
|
||||||
let emptySERIAL = {
|
let emptySERIAL = {
|
||||||
type: "FeatureCollection",
|
type: "FeatureCollection",
|
||||||
features: [
|
features: [
|
||||||
@ -28,6 +36,9 @@ let emptySERIAL = {
|
|||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set up the map with its data sources and its different layers.
|
||||||
|
*/
|
||||||
map.on('load', function () {
|
map.on('load', function () {
|
||||||
|
|
||||||
map.addSource('routeTCP', { 'type': 'geojson', 'data': emptyTCP })
|
map.addSource('routeTCP', { 'type': 'geojson', 'data': emptyTCP })
|
||||||
@ -69,11 +80,27 @@ map.on('load', function () {
|
|||||||
stateLegendEl.style.display = 'block';
|
stateLegendEl.style.display = 'block';
|
||||||
})
|
})
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to push coordinates data coming from a TCP connection
|
||||||
|
* into the emptyTCP geoJSON object.
|
||||||
|
* Called every time a message is received over TCP from the server.
|
||||||
|
*
|
||||||
|
* @param TCPlong longitude coming in from device connected over TCP port.
|
||||||
|
* @param TCPlat latitude coming in from device connected over TCP port.
|
||||||
|
*/
|
||||||
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);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to push coordinates data coming from a serial connection
|
||||||
|
* into the emptySERIAL geoJSON object.
|
||||||
|
* Called every time a message is received over serial connection from the server.
|
||||||
|
*
|
||||||
|
* @param SERIALlong longitude coming in from device connected over serial port.
|
||||||
|
* @param SERIALlat latitude coming in from device connected over serial port.
|
||||||
|
*/
|
||||||
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);
|
||||||
|
|||||||
@ -1,3 +1,9 @@
|
|||||||
|
/**
|
||||||
|
* This file defines the map in satellite style for the full replay page.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
|
mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
|
||||||
let map = new mapboxgl.Map({
|
let map = new mapboxgl.Map({
|
||||||
container: 'map',
|
container: 'map',
|
||||||
@ -5,6 +11,9 @@ let map = new mapboxgl.Map({
|
|||||||
zoom: 0
|
zoom: 0
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set up the map with its data sources and its different layers.
|
||||||
|
*/
|
||||||
map.on('load', function () {
|
map.on('load', function () {
|
||||||
|
|
||||||
map.addSource('routeTCP', { 'type': 'geojson', 'data': null })
|
map.addSource('routeTCP', { 'type': 'geojson', 'data': null })
|
||||||
@ -46,6 +55,10 @@ map.on('load', function () {
|
|||||||
stateLegendEl.style.display = 'block';
|
stateLegendEl.style.display = 'block';
|
||||||
})
|
})
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to add all collected coordinates sent in by the Smartphone to the map.
|
||||||
|
* @param sensordataList List of all received messages of the tcp source and their sensor data
|
||||||
|
*/
|
||||||
function updateMapTCPbulk(sensordataList) {
|
function updateMapTCPbulk(sensordataList) {
|
||||||
console.log("add TCP data to map")
|
console.log("add TCP data to map")
|
||||||
let geoJsonTCP = {
|
let geoJsonTCP = {
|
||||||
@ -72,6 +85,10 @@ function updateMapTCPbulk(sensordataList) {
|
|||||||
map.panTo(geoJsonTCP.features[0].geometry.coordinates[geoJsonTCP.features[0].geometry.coordinates.length-1]);
|
map.panTo(geoJsonTCP.features[0].geometry.coordinates[geoJsonTCP.features[0].geometry.coordinates.length-1]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to add all collected coordinates sent in by the Ublox to the map.
|
||||||
|
* @param sensordataList List of all received messages of the serial source and their sensor data
|
||||||
|
*/
|
||||||
function updateMapSERIALbulk(sensordataList) {
|
function updateMapSERIALbulk(sensordataList) {
|
||||||
console.log("add SERIAL data to map")
|
console.log("add SERIAL data to map")
|
||||||
let geoJsonSerial = {
|
let geoJsonSerial = {
|
||||||
|
|||||||
@ -1,4 +1,14 @@
|
|||||||
|
/**
|
||||||
|
* This file contains all the controls for the full replay page.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
let indexes
|
let indexes
|
||||||
|
//list of all horizontal accuracies sent in by the Ublox
|
||||||
|
let allAccSerial = []
|
||||||
|
//list of all coordinates sent in by the Ublox
|
||||||
|
let allSerialCoords = []
|
||||||
|
|
||||||
function composeTimestamp(servertime){
|
function composeTimestamp(servertime){
|
||||||
let composed;
|
let composed;
|
||||||
|
|||||||
@ -1,5 +1,14 @@
|
|||||||
|
/**
|
||||||
|
* This file defines a line chart used in the full replay page, showing Ublox speeds and
|
||||||
|
* smartphone speeds at a same moment in time in km/h, over time.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
|
//List of all speeds sent in by the Ublox
|
||||||
let allSpeedsSerial = []
|
let allSpeedsSerial = []
|
||||||
|
|
||||||
|
//Define the line chart and its properties
|
||||||
let ctx = document.getElementById('speedChart').getContext('2d');
|
let ctx = document.getElementById('speedChart').getContext('2d');
|
||||||
let speedChart = new Chart(ctx, {
|
let speedChart = new Chart(ctx, {
|
||||||
type: 'line',
|
type: 'line',
|
||||||
@ -48,6 +57,12 @@ let speedChart = new Chart(ctx, {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function filtering out speed data sent in by the Ublox using only the given indexes calculated in the refull.js file,
|
||||||
|
* and adding the data to the chart.
|
||||||
|
* As there is less smartphone data collected, we only want the Ublox speeds that come in at the moment with the
|
||||||
|
* smallest time difference between the TCP message and the Serial message.
|
||||||
|
*/
|
||||||
function addSerialSpeedData() {
|
function addSerialSpeedData() {
|
||||||
let speeds = []
|
let speeds = []
|
||||||
|
|
||||||
@ -58,6 +73,11 @@ function addSerialSpeedData() {
|
|||||||
speedChart.update();
|
speedChart.update();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function to extract only the speeds and Timestamps out of the messages received from the smartphone
|
||||||
|
* and add tem to the chart.
|
||||||
|
* @param sensordataList List of all received messages of the tcp source and their sensor data.
|
||||||
|
*/
|
||||||
function addTCPSpeedData(sensordataList) {
|
function addTCPSpeedData(sensordataList) {
|
||||||
let speedsTCP = []
|
let speedsTCP = []
|
||||||
let times = []
|
let times = []
|
||||||
|
|||||||
@ -1,3 +1,10 @@
|
|||||||
|
/**
|
||||||
|
* This file defines a doughnut chart used in the live tracking page, representing a speedometer showing
|
||||||
|
* Ublox speeds and smartphone speeds in km/h.
|
||||||
|
*
|
||||||
|
* @authors Timo Volkmann, Frank Herkommer.
|
||||||
|
*/
|
||||||
|
|
||||||
let options1 = {
|
let options1 = {
|
||||||
type: 'doughnut',
|
type: 'doughnut',
|
||||||
data: {
|
data: {
|
||||||
@ -142,12 +149,18 @@ let options2 = {
|
|||||||
cutoutPercentage: 65
|
cutoutPercentage: 65
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
//chart showing the actual speed of the two devices.
|
||||||
let ctx1 = document.getElementById('speedometer').getContext('2d');
|
let ctx1 = document.getElementById('speedometer').getContext('2d');
|
||||||
let mySpeedometer = new Chart(ctx1, options1);
|
let mySpeedometer = new Chart(ctx1, options1);
|
||||||
|
//chart adding the different speed areas colored from green to red.
|
||||||
let ctx2 = document.getElementById('speedometerSpeeds').getContext('2d');
|
let ctx2 = document.getElementById('speedometerSpeeds').getContext('2d');
|
||||||
let mySpeedometer2 = new Chart(ctx2, options2);
|
let mySpeedometer2 = new Chart(ctx2, options2);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function that adds speed data sent by the Ublox, converted to km/h, to the speedometer.
|
||||||
|
* Called every time a message is received over serial connection from the server.
|
||||||
|
* @param speedSERIAL speed of the Ublox in m/s
|
||||||
|
*/
|
||||||
function addSpeedSerial(speedSERIAL){
|
function addSpeedSerial(speedSERIAL){
|
||||||
let speedSERIALkmh = (speedSERIAL * 3.6)
|
let speedSERIALkmh = (speedSERIAL * 3.6)
|
||||||
let speedSERIALpercent = (speedSERIALkmh/250)*100
|
let speedSERIALpercent = (speedSERIALkmh/250)*100
|
||||||
@ -156,6 +169,11 @@ function addSpeedSerial(speedSERIAL){
|
|||||||
mySpeedometer.update();
|
mySpeedometer.update();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Function that adds speed data sent by the Smartphone, converted to km/h, to the speedometer.
|
||||||
|
* Called every time a message is received over tcp connection from the server.
|
||||||
|
* @param speedTCP speed of the Smartphone in m/s
|
||||||
|
*/
|
||||||
function addSpeedTcp(speedTCP){
|
function addSpeedTcp(speedTCP){
|
||||||
let speedTCPkmh = (speedTCP * 3.6)
|
let speedTCPkmh = (speedTCP * 3.6)
|
||||||
let speedTCPpercent = (speedTCPkmh/250)*100;
|
let speedTCPpercent = (speedTCPkmh/250)*100;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user