taralino

.text

Der Befehl Canvas.text(x, y, s) erwartet folgende (verpflichtende) Argumente:

Argument	Datentyp	Hinweis
x	Zahl	-
y	Zahl	-
s	Zeichenkette oder Zahl	-

Es wird die Zeichenkette bzw. die Zahl s geschrieben, wobei (x,y) der Mittelpunkt ist.

Falls s eine ganze Zahl ist, wird diese ohne Nachkommastellen angezeigt. Falls s eine rationale Zahl ist, wird diese mit vier Nachkommastellen angezeigt.

Zudem können folgende Optionen verwendet werden:

Variable	Datentyp	Hinweis	Default-Wert
fill	Farbe	-	black
stroke	Farbe	-	none
angle	Zahl	-	0.0
align	Zeichenkette	left, center oder right	center

Dabei definiert fill die Farbe der Füllung und stroke die Farbe der Kontur. Mit angle kann eine Drehung um den Mittelpunkt sowie im Uhrzeigersinn definiert werden, wobei der Winkel im Bogenmaß anzugeben ist. Schließlich definiert align die Textausrichtung.

Beispiel

Es werden einige Texte mit unterschiedlichen Optionen geschrieben.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

Canvas.init([0,10], [0,6], {width:480, background:"lightgrey"});
Canvas.text(2, 3, "Hello world!");
Canvas.circle(5, 3, 0.6);
Canvas.text(5, 3, "center", {fill:"yellow", angle:0.3});
Canvas.text(8, 3, 3.14, {fill:"red"});

</script>
</body>
</html>

Vorschau Download Kopie speichern

Beispiel

Demonstration der Textausrichtung

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

Canvas.init([-8,8], [0,4], {width:480, background:"lightgrey"});
Canvas.line(0, 0, 0, 4, {stroke:"grey"});

Canvas.text(0, 3, "MmmM");
Canvas.text(0, 2, "MmmM", {align:"left"});
Canvas.text(0, 1, "MmmM", {align:"right"});

</script>
</body>
</html>

Vorschau Download Kopie speichern