Ich habe eine Klasse, die grundsätzlich ein 16x30 Raster zeichnet.Positionstext bei x, y im Raster
Idealerweise würde Ich mag der Lage sein, auszuführen:
OSD.setCursor(x y);
OSD.print('Text');
und haben es die Wortposition Text
an Position x, y
mit jedem Zeichen des Text
an der richtigen Stelle positioniert das Gitter.
Hier ist, was ich bisher:
class MAX7456 {
constructor() {
this.items = null;
this.divs = null;
}
begin() {
var ratioH = 16,
ratioW = 30;
var parent = $('<div />', {
class: 'grid',
width: ratioW * 25,
height: ratioH * 18
}).addClass('grid').appendTo('body');
for (var i = 0; i < ratioH; i++) {
for(var p = 0; p < ratioW; p++) {
this.divs = $('<div />', {
width: 25 - 1,
height: 18 - 1
}).appendTo(parent);
this.items = $('<span />', {
width: 25 - 1,
height: 18 - 1,
style: "padding-left: 2px;"
}).appendTo(this.divs);
}
}
}
setCursor(x, y) {
$('div > span:nth-child(2n-1)').text(function (i, txt) {
\t $(this).append(i)
\t i++;
\t //console.log(txt + $(this).next().text());
});
}
print (txt) {
}
}
var OSD = new MAX7456();
OSD.begin(); // create grid
OSD.setCursor(0, 0); // set text at cursor (x, y)
OSD.print("Label 2");
body {
padding: 0;
font-size: 12px;
}
.grid {
border: 1px solid #ccc;
border-width: 1px 0 0 1px;
}
.grid div {
border: 1px solid #ccc;
border-width: 0 1px 1px 0;
float: left;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
ich genau wie diese Frage hatte. Lass mich dir die Antwort geben, mit der ich gearbeitet habe. – CodeMonkey
@Inuka Danke dafür! – fuzz
@fuzz, wenn Sie den Cursor auf eine beliebige Zahl setzen, sollte es in Text rechts ändern? –