Beiträge von stefanbla80

stefanbla80 · 10. April 2021

Danke - muss ich mir anschauen.

Hatte das so ähnlich, aber muss noch schauen wie ich das mache mit der Uhr wenn ich kein GPS Signal habe

=> vorerst passt das so!!

stefanbla80 · 9. April 2021

Hallo zusammen,

über Phyton bekomme ich von meiner GPS-Maus unter anderem auch die Uhrzeit bereitgestellt.

Diese übermittle ich mit JSON.

Diese Uhrzeit (gps.utc) stimmt nicht mit unserer aktuellen Zeit.

Ich sollte einen Offset (jetzt zur Sommerzeit) von zwei Stunden draufgeben.

In Python bekomme ich das mit meinen Kenntnissen aktuell nicht hin und wollte fragen ob das "einfach" mit HTML machbar ist?

Grüße

Stefan

stefanbla80 · 9. April 2021

Guten Morgen!!
Habe ich umgesetzt - funktioniert.

Vielen Dank!!

stefanbla80 · 9. April 2021

Guten Morgen!!
Also super, das scheint alles zu funktionieren.

Vielen vielen Dank

stefanbla80 · 8. April 2021

Sempervivum: Hammer, das ist was ich gesucht habe!!
=> Vielen Dank

Abschließend (zu diesem Thema):

In meiner vorherigen Version habe ich den Button für "shutdown" & "reboot" vorher abgefragt.

Das hat in der Funktion (so wie ich das verstehe) stattgefunden.

Button

Code

<form action="/shutdown">
                        <input type=submit onclick="return shutdown_clicked()" name=edit value=shutdown style=background-color:rgb(193,0,0);border-color:rgb(193,0,0);height:50px;width:200px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
                    </form>

Code

function shutdown_clicked(){
    return confirm('Would you like to shutdown?');
    }

Der Aufruf war jedoch generell ein anderer ...

Meine Versuche ich Abfrage "ja/nein" einzubauen sind gescheitert.

Code

$(document).ready(function(){
            $('#btnSendEIN1').click(function(){
                return confirm('Would you like switch on?')
                $.ajax({
                    type: 'POST',
                    url: '/relais1EIN',
                    success: function(data){
                        }
                    });
                });
            });

Alles anzeigen

Die Zeile mit dem "return" passt nicht ganz so wie ich das sehe.

Grüße

Stefan

stefanbla80 · 8. April 2021

wow, das ist ja noch einfacher ... Danke

kann ich eigentlich (nice to have) nach dem Klick in die Zelle:

1.) den Inhalt der Zelle auf "off" setzen

2.) beim klick dann auf "off" eine andere Funktion aufrufen um das Relais wieder auszuschalten?!

Vermutlich ähnliches Thema wie Umschaltung von km/h auf kn, aber doch ganz anders.

Oder ist sowas dann zu viel in HTML

Bin echt erstaunt was alles geht ...

stefanbla80 · 8. April 2021

Hallo zusammen,

Habe nochmals eine Frage zum Thema "Click in Zelle".

Vorheriger Stand

Mit einem "integrierten" Button in einer Zelle einer Tabelle habe ich das Thema bisher so gelöst.

Code

<td id=format_cellTemp>
    <form>
        <input id=btnSendAUS1 type=button name=edit value=off style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right> <input id=btnSendEIN1 type=button name=edit value=on style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
    </form>
</td>

Funktion

Code

<script language="JavaScript">
    <!--####################################################-->
        $(document).ready(function(){
            $('#btnSendEIN1').click(function(){
                $.ajax({
                    type: 'POST',
                    url: '/relais1EIN',
                    success: function(data){
                        alert(data);
                        }
                    });
                });
            });
    </script>

Alles anzeigen

###################################################################################################################

Neuer Stand
Der neue Stand ist die Nutzung eines Grids. Hier ist die Idee nicht mehr Buttons zu nutzen, sondern die Zelle an sich.

Code

        ....
        <div class="grid-item_relais" onclick="relais123_clicked(this, true);">on</div>
    </div>
</body>

Funktion

Code

<script language="JavaScript">
    <!--####################################################-->
    function relais123_clicked() {
        $(document).ready(function(){
            $('#btnSendAUS2').click(function(){
                $.ajax({
                    type: 'POST',
                    url: '/relais2AUS',
                    success: function(data){
                        alert(data);
                        }
                    });
                });
            });
    }
    </script>

Alles anzeigen

Diese Funktion soll eine Funktion in Python aufrufen - was beim alten Stand auch gut funktioniert hat.

Jedoch bekomme ich das mit dem Click in die Zelle (ohne Button) keinen Aufruf in dem Python Programm.

Ist sicher eine Kleinigkeit, aber ich sehe das aktuell nicht.

Grüße

Stefan

stefanbla80 · 8. April 2021

Hallo zusammen,

mit viel Hilfe von Sempervivum komme ich immer weiter und meine HTML-Seite wird immer besser

Heute geht es mir um einen erzwungenen Zeilenumbruch. Hier ein Auszug aus dem Code

Code

<body>
    <div id="grid-container">
        <div class="grid-item1">Battery 1</div>
        <div class="grid-item">
            <span style=font-size:40px id=Voltage1></span>&nbsp;V</br>
            <span style=font-size:40px id=Voltage2></span>&nbsp;V
        </div>

In meiner vorherigen Tabelle konnte ich das über "</br> lösen, hier wohl aber nicht.

=> Hat jemand eine Idee?!

Grüße

Stefan

stefanbla80 · 6. April 2021

Nachtrag

HTML

<html lang="de">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>MerryFisher | BoatPanel</title>
        <link rel="shortcut icon" href="{{ url_for('static', filename='MF.png') }}">
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <style type="text/css">
            table {
                background-color:rgb(0,0,0);
                border-color:rgb(0,0,0);
                border-spacing: 3px;
                border-collapse: separate;
                padding: 0px;
                width: 100%;
                height: 100%;
            }
            #format_page {
                background-color:rgb(0,0,0);
                border-spacing: 0px;
                padding: 0px;
            }
            #format_rows {
                background-color:rgb(50,50,50);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 100px;
            }
            #format_cell1 {
                background-color:rgb(75,75,75);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cell2 {
                background-color:rgb(120,120,120);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cell3 {
                background-color:rgb(48,84,150);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cell4 {
                background-color:rgb(198,89,17);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cell5 {
                background-color:rgb(191,143,0);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cell6 {
                background-color:rgb(84,130,53);
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: left;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cellVolt {
                color: white;
                border-spacing: 0px;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cellTemp {
                color: white;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cellVelocity {
                color: white;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 30px;
            }
            #format_cellTime {
                color: white;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 90px;
            }
            #format_cellDate {
                color: white;
                padding: 0px;
                vertical-align: middle;
                text-align: center;
                font-family: Arial;
                font-weight: bold;
                font-size: 50px;
            }
            #column1 { width: 17%; }
            #column2 { width: 17%; }
            #column3 { width: 36%; }
            #column4 { width: 30%; }
        </style>
    </head>
    <body id="format_page">
        <table>
            <colgroup>
                <col id="column1">
                <col id="column2">
                <col id="column3">
                <col id="column4">
            </colgroup>
            <tr id=format_rows>
                <td id=format_cell1>&nbsp Battery 1</td>
                <td id=format_cellTemp><span style=font-size:40px id=Voltage1></span>&nbsp;V</td>
                <td id=format_cellVelocity rowspan=2><span style=font-size:90px id=GPSSpeedkmh></span>&nbsp;km/h</br><span style=font-size:50px id=GPSSpeedkn></span>&nbsp;kn</td>
                <td id=format_cellTime rowspan=2><span id=GPSTime></span></br><span style=font-size:40px id=GPSDate></span></td>
            </tr>
            <tr id=format_rows>
                <td id=format_cell2>&nbsp Battery 2</td>
                <td id=format_cellTemp><span style=font-size:40px id=Voltage2></span>&nbsp;V</td>
            </tr>
            <tr id=format_rows>
                <td id=format_cell3>&nbsp Temp. 1</td>
                <td id=format_cellTemp><span style=font-size:40px id=Temperature1></span>&nbsp;°C</td>
                <td id=format_cellTemp><span style=font-size:40px id=GPSLat></span>&nbsp;°</td>
                <td id=format_cellTemp>
                    <form action="/shutdown">
                        <input type=submit onclick="return shutdown_clicked()" name=edit value=shutdown style=background-color:rgb(193,0,0);border-color:rgb(193,0,0);height:50px;width:200px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
                    </form>
                </td>
            </tr>
            <tr id=format_rows>
                <td id=format_cell4>&nbsp Temp. 2</td>
                <td id=format_cellTemp><span style=font-size:40px id=Temperature2></span>&nbsp;°C</td>
                <td id=format_cellTemp><span style=font-size:40px id=GPSLog></span>&nbsp;°</td>
                <td id=format_cellTemp>
                    <form action="/reboot">
                        <input type=submit onclick="return reboot_clicked()" name=edit value=reboot style=background-color:rgb(255,51,0);border-color:rgb(255,51,0);height:50px;width:200px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
                    </form>
                </td>
            </tr>
            <tr id=format_rows>
                <td id=format_cell5>&nbsp Temp. 3</td>
                <td id=format_cellTemp><span style=font-size:40px id=Temperature3></span>&nbsp;°C</td>
                <td id=format_cellTemp><span style=font-size:40px id=GPSDistancekm></span>&nbsp;km</td>
                <td id=format_cellTemp>
            <form>
                        <input id=btnSendAUS1 type=button name=edit value=off style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right> <input id=btnSendEIN1 type=button name=edit value=on style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
            </form>
                </td>
            </tr>
            <tr id=format_rows>
                <td id=format_cell6>&nbsp Temp. 4</td>
                <td id=format_cellTemp><span style=font-size:40px id=Temperature4></span>&nbsp;°C</td>
                <td id=format_cellTemp><span style=font-size:40px id=GPSDistancesm></span>&nbsp;sm</td>
                <td id=format_cellTemp>
            <form>
                        <input id=btnSendAUS2 type=button name=edit value=off style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right> <input id=btnSendEIN2 type=button name=edit value=on style=background-color:rgb(0,45,85);border-color:rgb(0,45,85);height:50px;width:100px;color:rgb(255,255,255);font-size:20px;font-weight:bold;float:right>
            </form>
                </td>
            </tr>
        </table>
    </body>
</html>

Alles anzeigen

stefanbla80 · 6. April 2021

Hallo zusammen,

Ich habe etwas Probleme mit der Darstellung meiner Seite.

Hintergrund

Die HTML-Seite wird über einen Raspberry bereitgestellt.

Es ist ein „BoatPanel“ – also ein Display, welches auf einem Boot installiert werden soll und z. B.

- Spannungswerte der Bordbatterien

- Vier Temperaturwerte

- Geschwindigkeit

- usw. anzeigen

Tabelle

Die HTML-Seite ist eine reine Tabelle welche z. B. auf dem direkt am Raspi angeschlossenen 7“ Display dargestellt werden soll.

Aber auch z. B. über ein Tablet aufrufbar sein soll.

=> Muss ich hier beim Code etwas beachten?!

Screenshot

Manche Zeilen sind mit „rowspan“ verbunden

Bild1: Display Raspi [Blockierte Grafik: https://ibb.co/b3zQgy7]

Bild2: iPad [Blockierte Grafik: https://ibb.co/n1f918k]

Mir scheint, als ob durch die Verbindung der Zeile 1 mit Zeile 2 (Geschwindigkeitswert) die Tabelle nicht mehr nach meinen Vorgaben aufgeteilt wird.

Auf dem Tablet zu erkennen, dass die zweite Zeile eine andere Zeilenhöhe hat.

HTML/CSS

Auch kenne ich mich mit HTML nicht besonders aus.

=> Ich bräuchte etwas Hilfe. Würde gerne alles dem jeweiligen Bildschirm anpassen.

Grüße

Stefan

stefanbla80 · 1. April 2021

Guten Morgen zusammen,

Also das mit dem Runden des Wertes scheint nicht wirklich zu funktionieren.

Code

<script>
        function convertSpeed(
            cell, // Die Tabellenzelle (DOM-Element)
            switchIt // Gibt an, ob umgeschaltet werden soll
        ) {
            // Der Faktor fuer die Umrechnung nach Knoten:
            const factorToKn = 0.54;
            // Aktuellen Inhalt der Zelle auslesen:
            const val = parseInt(cell.textContent);
            // Wenn noch nicht geschehen
            // oder
            // wenn es sich um ein Update handelt:
            // Den Wert fuer km/h speichern:
            if (!cell.dataset.kmph || !switchIt) {
                cell.dataset.kmph = val;
            }
            if (switchIt) {
                // Klasse umschalten:
                cell.classList.toggle('knoten');
            }
            // Die Klasse "knoten" gibt an, ob der Inhalt
            // in Knoten ist (wenn Klasse gesetzt)
            // oder km/h (wenn Klasse nicht gesetzt.
            // Entsprechend die Umrechnung durchfuehren:
            let value, unit, cls;
            if (cell.classList.contains('knoten')) {
                value = cell.dataset.kmph * factorToKn;
                valueRounded = value.toFixed(1);
                unit = 'kn';
            } else {
                value = cell.dataset.kmph;
                valueRounded = value.toFixed(1);
                unit = 'km/h';
            }
            const html = `<span style=font-size:100px id="tempPos1">${valueRounded}</span>&nbsp;${unit}`;
            cell.innerHTML = html;
            console.log('ende');
        }
    </script>

Alles anzeigen

Siehe in rot im Code. Hier kommen keine Werte und ich kann auch nicht "umschalten.

Mache ich das an einer falschen Stelle, muss etwas importiert werden?

Grüße

Stefan

Nachtrag. Im Code kann die Schriftfarbe nicht geändert werden ...
Hinzugefügt habe ich: "valueRounded = value.toFixed(1);"

stefanbla80 · 31. März 2021

Das sieht schon mal super aus Wahnsinn, da steig ich wirklich aus ...

Werde das Thema morgen in Bewegung testen, immer wieder habe ich kein GPS Signal und dann kommen keine "sinnvollen" Werte.

Werde (so denke ich) das Thema runden noch angehen müssen.

Code

const html = `<span style=font-size:100px id="tempPos1">${value}</span>&nbsp;${unit}`;
html = Math.round(html * 100) / 100;
cell.innerHTML = html;
console.log('ende');

Der Wert soll max. zwei, eher eine Nachkommastelle haben.

Vielen vielen Dank für heute, melde mich morgen sicher nochmals

Grüße

Stefan

stefanbla80 · 31. März 2021

Ich denke Du/wir sind auf einem sehr guten Weg.

Vielen Dank für Deine Mühen ...

1.) Beim Start der Homepage kommt der Geschwindigkeitswert vom GPS: z. B. 0.5 km/h (Wert mit Einheit km/h)

2.) beim ersten Klicken in die Zelle wird minimal "kurz" umgerechnet, aber sofort erscheint wieder der km/h Wert von zuvor, jedoch mit dem Unterschied, dass dann hinter 0.5 km/h noch kn steht (kleiner geschrieben, also sicher vom body-part der HMTL-Seite).

3.) Klicke ich wieder in die Zelle kommt wieder kurz die Umrechnung, jedoch wird der km/h Wert wieder angezeigt (0.5 km/h mit km/h (zweites km/h wieder kleiner geschrieben als der vorherige)

Die Einheit (Einheit kleingeschrieben "hinten") wird richtig "umgeschaltet" - wenn auch diese doppelt irgendwie vorkommt (evtl. vom kompletten Übernehmen des Zellwertes ...)

=> Mein Wissen / Verständnis reicht leider aktuell nicht aus ...

stefanbla80 · 31. März 2021

Hier ein Auszug aus dem body der HTML-Seite

Code

<body id="format_page">
        <table>
            <tr id=format_rows>
                <td id=format_cell1>&nbsp Battery 1</td>
                <td id=format_cellTemp><span style=font-size:40px id=tempVolt1></span>&nbsp;V</td>
                <td id=format_cellVelocity rowspan=2 onclick="convertSpeed(this);"><span style=font-size:100px id=tempPos1></span>&nbsp;km/h</td>
                <td id=format_cellTime rowspan=2><span id=time></span></br><span style=font-size:40px id=date></span></td>
            </tr>

In grün die Zelle, die dynamisch befüllt sind über:

Code

$(
        function dyngps()
        {
            var updated_data_gps  = $.get('/update_gps');

            updated_data_gps.done(function(results){
                $("#tempPos1").text(results.results[0]);            
                $("#tempPos2").text(results.results[1]);
                $("#tempPos3").text(results.results[2]);            
                setTimeout(function(){dyngps();},200);
            });
        }
        );

Alles anzeigen

Funktioniert "tadellos".

Hintergrund: Die Anzeige wird auf einem Motorboot platziert. Beim Starten der Seite soll "km/h" als Grundsetting angezeigt werden.

In gewissen Situationen ist es ggf. sinnvoll einfach Einheiten umstellen zu können. Also z. B. km/h in knoten.

Zitat

Wie soll es denn funktionieren?

a) Soll der Wert auf km/h zurück gesetzt werden? Dann müssen wir die Klassen und data-Attribute einfach in Grundstellung bringen. Bzw. wenn die Seite neu geladen wird, brauchen wir gar nichts zu tun.

oder

b) Soll die letzte Einheit nach der Aktualisierung erhalten bleiben? Dann müssen wir die Klassen und data-Attribute ebenfalls entspr. setzen.

a.) die Umstellung soll "manuell" zwischen den Einheiten gemacht werden

b.) Die Einheit soll nach der Aktualisierung erhalten bleiben. Wähle ich selbstständig "knoten" aus, dann bleibt bei der Aktualisierung des Wertes auch knoten bestehen, bis ich eben wieder umschalten

Die Werte kommen aus Python 3.

Grüße
Stefan

stefanbla80 · 31. März 2021

Hallo Sempervivum,

Danke nochmals für Deinen Code.

Habe mich mit dem ersten beschäftigt.

Das sieht schon mal gut aus.

Eine Frage noch: Der Wert in der besagten Zelle wird alle 200 ms aktualisiert (GPS-Signal).

Wie bekommt die Funktion diese Aktualisierung mit und ändert somit zeitlich den Wert für km/h oder kn?!

Aktuell verstehe ich Deinen Code so, dass dies jeweils nur beim Click in die Zelle aufgerufen wird.

Ich habe versucht einen Intervall zu setzen, aber in Bezug auf welche Zelle?!

Code

var interval = window.setInterval("convertSpeed(id=tempPos1)", 500);

Meine Zelle bekommt den Wert von „id=tempPos1“

=> Aber das hat alles auch nicht wirklich funktioniert

Dein Code (mit der Erweitung des Intervalls)

Code

<script>
        var interval = window.setInterval("convertSpeed(id=tempPos1)", 500);
        function convertSpeed(cell) {
            // Der Faktor fuer die Umrechnung nach Knoten:
            const factorToKn = 0.539957;
            // Aktuellen Inhalt der Zelle auslesen:
            const val = parseInt(id=tempPos1);
            // Wenn noch nicht geschehen: Den Wert fuer km/h
            // speichern:
            if (!cell.dataset.kmh) {
                cell.dataset.kmh = val;
            }
            // Die Klasse "knoten" gibt an, ob der Inhalt
            // in Knoten ist (wenn Klasse gesetzt)
            // oder km/h (wenn Klasse nicht gesetzt.
            // Entsprechend die Umrechnung durchfuehren:
            if (cell.classList.contains('knoten')) {
                cell.textContent = cell.dataset.kmh + ' km/h';
            } else {
                cell.textContent = val * factorToKn + ' kn';
            }
            // Klasse umschalten:
            cell.classList.toggle('knoten');
        }
    </script>

Alles anzeigen

Auch ändert sich mit dem Klick in die Zelle meine Formatierung.

Aber das ist sicher ein anderes Thema ...

Grüße

Stefan

stefanbla80 · 31. März 2021

Guten Morgen,

vielen Dank für Deine Antwort - werde ich mir im Laufe des Tages anschauen.

Das mit dem Doppelpost sollte so nicht sein, ich hatte lediglich das Gefühl, dass ich keine Antwort bekommen.
Dieses Thema aber "schnell" abschließen muss.

Grüße

Stefan

stefanbla80 · 30. März 2021

Hallo zusammen,

Ein Raspi 3b stellt mir über Python / Flask eine Webseite zur Verfügung.

Auf dieser Webseite werden z. B. Temperaturwerte, Spannungswerte aber auch km/h über eine GPS-Maus angezeigt.

-> Funktioniert ganz gut

Die einzelnen Werte werde in einer Tabelle dargestellt.

Jetzt würde ich gerne bei Klick auf einen Button bzw. bei Klick in die Zelle der Geschwindigkeit „Umschalten“ auf knoten bzw. eine andere Einheit.

Der eigentliche Wert wird mit JSON an die Seite übermittelt, aktuell rechne ich die GPS-Daten also in Python um und zeige diese lediglich an.

Ich könnte mir vorstellen den Faktor nun in der HTML-Seite zu haben, aber keine Ahnung wie ...

HTML kann ich nun leider nicht so tiefgreifend um genau diese Funktion zu integrieren.

Aus diesem Grund erhoffe ich mir Hilfe in diesem Forum.

Grüße

Stefan

stefanbla80 · 4. August 2020

ich habe noch das hier gefunden

https://blog.miguelgrinberg.co…sk-application-over-https

Aber: Bevor ich den Raspi noch heute „zerstöre“ warte ich bis nach meinem Urlaub.

Den Raspi würde ich gerne mit den Temperatursensoren funktionsfähig mitnehmen...

Falls dir noch was einfällt sehr sehr gerne, ich danke vielmals für Deine Geduld und Einsatz

stefanbla80 · 4. August 2020

Also sieht es dann unmöglich aus?!

stefanbla80 · 4. August 2020

Mmmh, keine Änderung.
Ich nutze Safari von Apple ...

Code

// hier die Sensoren wie bisher
        const thelog = document.getElementById('log');
        function updateSpeed() {
            thelog.innerHTML += 'start geoloc<br>';
            if (navigator.geolocation) {
                thelog.innerHTML += 'geoloc avail<br>';
        document.querySelector("#getspeed").textContent = 0.0
        document.querySelector("#getlat").textContent = 0.0
                navigator.geolocation.getCurrentPosition(function (position) { // <-- hier
                    thelog.innerHTML += 'speed=' + position.coords.speed + '<br>';
                    // console.log(position, position.coords.latitude, position.coords.longitude, position.coords.speed);
                    // console.log(position.coords.latitude, position.coords.longitude);
            console.log(position.coords.latitude, position.coords.speed);
                    document.querySelector("#getlat").textContent = position.coords.latitude;
                    // document.querySelector("#getlng").textContent = position.coords.longitude;
                    document.querySelector("#getspeed").textContent = position.coords.speed * 3.6
                });
            } else {
                thelog.innerHTML += 'geoloc not avail<br>';
            }
        }
        updateSpeed();
        setInterval(updateSpeed, 1000);

Alles anzeigen

Setze noch die Werte auf Null

html-seminar.de/woltlab/attachment/2582/

Beiträge von stefanbla80

Zeitoffset mit HTML

Zeitoffset mit HTML

Zeilenumbruch in einem Grid

Click in Zelle führt Funktion aus

Click in Zelle führt Funktion aus

Click in Zelle führt Funktion aus

Click in Zelle führt Funktion aus

Zeilenumbruch in einem Grid

HTML-Tabelle | Formatierung / Anpassung der Spaltenbreiten/Zeilenhöhen

HTML-Tabelle | Formatierung / Anpassung der Spaltenbreiten/Zeilenhöhen

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

Umrechnung km/h <–> knoten

HTML Code GeoLocating

HTML Code GeoLocating

HTML Code GeoLocating