mal ein zwischenstand...

This commit is contained in:
Joerg Lehmann 2021-03-13 20:08:01 +01:00
parent 4374027909
commit 938ea11f68
2 changed files with 10 additions and 23 deletions

View File

@ -34,7 +34,7 @@
</div> </div>
<div class="slidecontainer"> <div class="slidecontainer">
<input class="slider" id="datetimeslider" type="range" label="Zeitpunkt" min="0" max="0" step="1" value="" onchange="updateSlider(this)" ontouchmove="updateSliderTooltip(this)" onmousemove="updateSliderTooltip(this)" /> <input class="slider" id="datetimeslider" type="range" label="Zeitpunkt" min="0" max="0" step="1" value="" ontouchmove="updateSliderTooltip(this)" onmousemove="updateSliderTooltip(this)" />
</div> </div>
{{ else }} {{ else }}
<h4>Bitte zuerst <a href="login.html">einloggen</a></h4> <h4>Bitte zuerst <a href="login.html">einloggen</a></h4>

View File

@ -5,6 +5,7 @@ var stop = urlParams.get('stop');
var lon = urlParams.get('lon'); var lon = urlParams.get('lon');
var lat = urlParams.get('lat'); var lat = urlParams.get('lat');
var map; var map;
var last_slider_position;
if (start == null) { if (start == null) {
var dstart = moment({hour: 0}); var dstart = moment({hour: 0});
@ -47,6 +48,7 @@ function refreshDatapoints(deveui, start, stop) {
datapoints = mydata; datapoints = mydata;
$('#datetimeslider').attr('max', mydata.length - 1); $('#datetimeslider').attr('max', mydata.length - 1);
$('#datetimeslider').val(mydata.length - 1); $('#datetimeslider').val(mydata.length - 1);
last_slider_position = mydata.length - 1;
var unix_timestamp = mydata[mydata.length - 1][0]; var unix_timestamp = mydata[mydata.length - 1][0];
var date = new Date(unix_timestamp * 1000); var date = new Date(unix_timestamp * 1000);
var myhtml = moment(date).format('DD.MM.YYYY HH:mm') + ' / ' + mydata[mydata.length - 1][3] + '% <i class="fa fa-battery-three-quarters"></i>'; var myhtml = moment(date).format('DD.MM.YYYY HH:mm') + ' / ' + mydata[mydata.length - 1][3] + '% <i class="fa fa-battery-three-quarters"></i>';
@ -54,27 +56,8 @@ function refreshDatapoints(deveui, start, stop) {
}); });
} }
function updateSlider(c)
{
if(c.value <= 50000)
{
if(c.step != 1)
c.step = 1;
//alert(c.value);
}
else
{
if(c.step != 3)
c.step = 3;
//alert(c.value);
}
}
$(document).ready(function() { $(document).ready(function() {
var position = ol.proj.fromLonLat([lon, lat], "EPSG:2056"); var position = ol.proj.fromLonLat([lon, lat], "EPSG:2056");
console.log("Document Ready Position:");
console.log(position);
var layer = ga.layer.create('ch.swisstopo.pixelkarte-farbe'); var layer = ga.layer.create('ch.swisstopo.pixelkarte-farbe');
map = new ga.Map({ map = new ga.Map({
@ -184,6 +167,13 @@ $(function() {
function updateSliderTooltip(c) function updateSliderTooltip(c)
{ {
if (c.value == last_slider_position) {
// we don't do anything if slider position did not change...
return
}
last_slider_position = c.value;
console.log("Slider position changed...");
var unix_timestamp = datapoints[c.value][0]; var unix_timestamp = datapoints[c.value][0];
var date = new Date(unix_timestamp * 1000); var date = new Date(unix_timestamp * 1000);
var myhtml = moment(date).format('DD.MM.YYYY HH:mm') + ' / ' + datapoints[c.value][3] + '% <i class="fa fa-battery-three-quarters"></i>'; var myhtml = moment(date).format('DD.MM.YYYY HH:mm') + ' / ' + datapoints[c.value][3] + '% <i class="fa fa-battery-three-quarters"></i>';
@ -191,9 +181,6 @@ function updateSliderTooltip(c)
var position = ol.proj.fromLonLat([datapoints[c.value][2], datapoints[c.value][1]], "EPSG:2056"); var position = ol.proj.fromLonLat([datapoints[c.value][2], datapoints[c.value][1]], "EPSG:2056");
console.log("updateSliderTooltip Position:");
console.log(position);
// Create the layer with the icon // Create the layer with the icon
var vectorLayer2 = new ol.layer.Vector({ var vectorLayer2 = new ol.layer.Vector({
source: new ol.source.Vector({ source: new ol.source.Vector({