nicht angemeldet
Hey zusammen, Zwar steht HTML zwar auf meiner ToDo Liste mit Dingen die ich noch lernen will leider bleibt mir für dieses Projekt dafür aber nicht die Zeit. Mit einem ESP 32 möchte / muss ich für ein Projekt die Steuerung eines Gefährtes übernehmen. Dafür wollte ich diesen JoyStick verwenden:
https://github.com/bobboteck/JoyStick
das an sich klappt auch den Code habe ich so angepasst das nur noch ein JoyStick übrig geblieben ist. Die X und Y Werte muss ich jetzt "nur" noch irgendwie auf meinen ESP bekommen.
Ich habe schon mehrere Stunden recherchiert und den ESP auch zumindest soweit bekommen das er den Wert einer Seite auslesen und verarbeiten kann. Jetzt würde ich gerne entweder in der HTML oder im JavaScript die X und Y Daten entweder jeweils auf eine Seite oder zusammen auf eine Seite zu schreiben. Aber es gibt ein so riesiges Angebot von Tutorials die ich alle nicht so recht verstanden habe. Leider fehlt mir die Zeit um mich noch nicht wochenlang da durch zulesen
Nochmal zusammengefasst:
Ich brauche einen Code entweder im JavaScript oder HTML der mir nur den Wert auf die Seite schreibt.
Vielleicht hat ja jemand da einen Link um meine Suche etwas zu vereinfachen oder würde sich selber die Mühe machen da etwas zusammen zu schreiben.
Natürlich ginge auch jede andere Möglichkeit um die Daten auf meinen ESP zu bekommen.
<!DOCTYPE HTML>
<html>
<head>
<title>Joy</title>
<meta charset="utf-8">
<meta name="description" content="Example page of use pure Javascript JoyStick">
<meta name="author" content="Roberto D'Amico">
<link rel="shortcut icon" type="image/png" href="http://bobboteck.github.io/img/roberto-damico-bobboteck.png">
<style>
*
{
box-sizing: border-box;
}
body
{
margin: 0px;
padding: 0px;
font-family: monospace;
}
.row
{
display: inline-flex;
clear: both;
}
.columnLateral
{
float: left;
width: 15%;
min-width: 300px;
}
#joystick
{
border: 1px solid #FF0000;
}
</style>
<script src="joy.js"></script>
</head>
<body>
<!-- Example of two JoyStick integrated in the page structure -->
<div class="row">
<div class="columnLateral">
<div id="joy1Div" style="width:200px;height:200px;margin:50px"></div>
Posizione X:<input id="joy1PosizioneX" type="text" /><br />
Posizione Y:<input id="joy1PosizioneY" type="text" /><br />
Direzione:<input id="joy1Direzione" type="text" /><br />
X :<input id="joy1X" type="text" /></br>
Y :<input id="joy1Y" type="text" />
</div>
</div>
<script type="text/javascript">
// Create JoyStick object into the DIV 'joy1Div'
var Joy1 = new JoyStick('joy1Div');
var joy1IinputPosX = document.getElementById("joy1PosizioneX");
var joy1InputPosY = document.getElementById("joy1PosizioneY");
var joy1Direzione = document.getElementById("joy1Direzione");
var joy1X = document.getElementById("joy1X");
var joy1Y = document.getElementById("joy1Y");
setInterval(function(){ joy1IinputPosX.value=Joy1.GetPosX(); }, 50);
setInterval(function(){ joy1InputPosY.value=Joy1.GetPosY(); }, 50);
setInterval(function(){ joy1Direzione.value=Joy1.GetDir(); }, 50);
setInterval(function(){ joy1X.value=Joy1.GetX(); }, 50);
setInterval(function(){ joy1Y.value=Joy1.GetY(); }, 50);
</script>
</body>
</html>`
P.S. der JavaScript code ist zu lang und die Option zum Anhängen ha ich gefunden. Demn müsstet ihr euch unter dem Link oben holen.
Schöne Grüße Roger
JürgenB
Der Martin
Rolf B