diff --git a/static/scripts/chartfull.js b/static/scripts/chartfull.js
new file mode 100644
index 0000000..4f4c06a
--- /dev/null
+++ b/static/scripts/chartfull.js
@@ -0,0 +1,44 @@
+var ctx = document.getElementById('myChart').getContext('2d');
+var myChart = new Chart(ctx, {
+ type: 'line',
+ data: {
+ labels: new Array(),
+ datasets: [{
+ label: 'Z',
+ backgroundColor: 'rgba(255, 99, 132, 1)',
+ borderColor: 'rgba(255, 99, 132, 1)',
+ borderWidth: 1,
+ fill: false,
+ pointRadius: 0,
+ lineTension: 0.5,
+ data: new Array()
+ }]
+ },
+ options: {
+ scales: {
+ yAxes: [{
+ ticks: {
+ // beginAtZero: true
+ min: -2000,
+ max: 2000
+ }
+ }]
+ },
+ animation: {
+ duration: 0
+ }
+ }
+});
+myChart.data.labels.fill("", 0, GRAPH_RES);
+myChart.data.datasets.forEach((dataset) => dataset.data.fill(0, 0, GRAPH_RES))
+function addSerialAltData(data) {
+ myChart.data.labels.push("");
+ myChart.data.datasets.forEach((dataset) => {
+ dataset.data.push(data);
+ });
+ while (myChart.data.labels.length >= GRAPH_RES) {
+ myChart.data.labels.shift();
+ myChart.data.datasets.forEach((dataset) => dataset.data.shift())
+ }
+ myChart.update();
+};
diff --git a/static/scripts/mapfull.js b/static/scripts/mapfull.js
new file mode 100644
index 0000000..f661248
--- /dev/null
+++ b/static/scripts/mapfull.js
@@ -0,0 +1,99 @@
+mapboxgl.accessToken = 'pk.eyJ1IjoiZmhlcmtvbW0iLCJhIjoiY2tobm81bXppMGVuNzMyazY3eDU0M2dyaSJ9.qWJrwtv7KitW60pzs6h3Gg';
+var map = new mapboxgl.Map({
+ container: 'map',
+ style: 'mapbox://styles/mapbox/satellite-v9',
+ zoom: 0
+});
+
+map.on('load', function () {
+
+ map.addSource('routeTCP', { 'type': 'geojson', 'data': null })
+ map.addSource('routeSERIAL', { 'type': 'geojson', 'data': null })
+
+ map.addLayer({
+ 'id': 'routeTCP',
+ 'type': 'line',
+ 'source': 'routeTCP',
+ 'layout': {
+ 'visibility': 'visible'
+ },
+ 'paint': {
+ 'line-color': 'rgba(30, 139, 195, 1)',
+ 'line-opacity': 1,
+ 'line-width': 5
+ }
+ });
+
+ map.addLayer({
+ 'id': 'routeSERIAL',
+ 'type': 'line',
+ 'source': 'routeSERIAL',
+ 'layout': {
+ 'visibility': 'visible'
+ },
+ 'paint': {
+ 'line-color': 'rgba(214, 69, 65, 1)',
+ 'line-opacity': 1,
+ 'line-width': 5
+ }
+ });
+
+
+ map.jumpTo({ 'center': [9.19640999, 49.12283027], 'zoom': 16 });
+ map.setPitch(30);
+
+ var stateLegendEl = document.getElementById('state-legend');
+ stateLegendEl.style.display = 'block';
+})
+
+function updateMapTCPbulk(sensordataList) {
+ console.log("add TCP data to map")
+ let geoJsonTCP = {
+ type: "FeatureCollection",
+ features: [
+ {
+ type: "Feature",
+ geometry: {
+ type: "LineString",
+ coordinates: []
+ }
+ }]
+ }
+ sensordataList.forEach(sensordata => {
+ if (sensordata.Position[0] === 0 && sensordata.Position[1] === 0 && sensordata.Position[2] === 0) {
+ return;
+ }
+ let lat = sensordata.Position[0]
+ let lon = sensordata.Position[1]
+ geoJsonTCP.features[0].geometry.coordinates.push([lon, lat]);
+
+ })
+ map.getSource('routeTCP').setData(geoJsonTCP);
+ map.panTo(geoJsonTCP.features[0].geometry.coordinates[geoJsonTCP.features[0].geometry.coordinates.length-1]);
+}
+
+function updateMapSERIALbulk(sensordataList) {
+ console.log("add SERIAL data to map")
+ let geoJsonSerial = {
+ type: "FeatureCollection",
+ features: [
+ {
+ type: "Feature",
+ geometry: {
+ type: "LineString",
+ coordinates: []
+ }
+ }]
+ }
+ sensordataList.forEach(sensordata => {
+ if (sensordata.Position[0] === 0 && sensordata.Position[1] === 0 && sensordata.Position[2] === 0) {
+ return;
+ }
+ let lat = sensordata.Position[0]
+ let lon = sensordata.Position[1]
+ geoJsonSerial.features[0].geometry.coordinates.push([lon, lat]);
+
+ })
+ map.getSource('routeSERIAL').setData(geoJsonSerial);
+ map.panTo(geoJsonSerial.features[0].geometry.coordinates[geoJsonSerial.features[0].geometry.coordinates.length-1]);
+}
diff --git a/static/scripts/refull.js b/static/scripts/refull.js
new file mode 100644
index 0000000..8da93b0
--- /dev/null
+++ b/static/scripts/refull.js
@@ -0,0 +1,50 @@
+var trackingdata = null;
+
+window.addEventListener("load", function(evt) {
+ //------------------------Buttons------------------------------
+
+ var trackings = null;
+ document.getElementById("messungladen").onclick = function(evt) {
+ fetch('http://localhost:3011/trackings/', { method: 'GET'}).then(results => {
+ return results.json()
+ }).then(r => {
+ console.log(r)
+ if (!'data' in r) {
+ return
+ }
+ trackings = r.data
+ let sel = document.getElementById("meas")
+ sel.innerHTML = ''
+ r.data.forEach(tracking => {
+ console.log(tracking)
+ var option = document.createElement("option");
+ option.text = tracking.TimeCreated + " Size: " + tracking.Size
+ sel.add(option)
+ })
+ sel.disabled = false
+ document.getElementById("replaystarten").disabled = false
+
+ })
+ };
+
+ document.getElementById("replaystarten").onclick = function(evt) {
+ let sel = document.getElementById("meas")
+ console.log(trackings[sel.selectedIndex].UUID)
+ fetch(`http://localhost:3011/trackings/${trackings[sel.selectedIndex].UUID}`, { method: 'GET'}).then(results => {
+ return results.json()
+ }).then(r => {
+ // console.log(r.data.Data)
+ console.log(r.data)
+ if ('SOURCE_TCP' in r.data.Data && r.data.Data.SOURCE_TCP.length > 0) {
+ updateMapTCPbulk(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)
+ }
+ })
+
+ }
+
+
+});
+
diff --git a/templates/replayFull.html b/templates/replayFull.html
index f4edae9..ce64af5 100644
--- a/templates/replayFull.html
+++ b/templates/replayFull.html
@@ -2,33 +2,43 @@
-
+
-
+
+
+
+
-
-
-
-
-
-
Legende
-
Ublox
-
Smartphone
-
-
-
-
-
-
+
+
-
+
+
+
+
Legende
+
Ublox
+
Smartphone
+
+
+
+
+
+
+
+
+
+
-
+
+