WaBis

walter.bislins.ch

JSG3D: JsgPlane

Zum Zeichnen kann eine JsgPlane (Ebene) im 3D-Raum erzeugt werden und es kann mit den JsgPlane Funktionen auf diese Ebene 2D-Grafik gezeichnet werden. Die enstprechende Zeichnung erscheint jedoch dreidimensional.

Ausnahme: Texte werden nicht auf die Plane projiziert, sondern immer auf das Window. Lediglich ihre Position wird auf die Plane bezogen.

JsgPlane Klasse

JsgPlane = {
Pos: JsgVect3; ReadOnly
3D-Position des Nullpunktes der Ebene.
XDir: JsgVect3; ReadOnly
X-Richtung auf der Ebene
YDir: JsgVect3; ReadOnly
Y-Richtung auf der Ebene
Normal: JsgVect3; ReadOnly
optionaler Normalen-Vektor der Ebene
Result: JsgVect3; ReadOnly
Resultate einiger Berechnungen werden hier gespeichert
ResultPoly: JsgPolygon; ReadOnly
Resultate einiger Berechnungen werden hier gespeichert
ExitPoint: JsgVect3; ReadOnly
Siehe ClipPoly() und ClipArea()
EnterPoint: JsgVect3; ReadOnly
Siehe ClipPoly() und ClipArea()
}

Um eine unverzerrte Abbildung der Grafik auf der Ebene zu erhalten, müssen XDir und YDir senkrecht aufeinander stehen und die Längen 1 haben. Dies kann durch den Parameter Normalize beim Erzeugen der Ebene erreicht werden, siehe JsgPlane(), Copy() und Normalize().

Wenn verzerrte Darstellungen erwünscht sind, sind enstprechend beliebige Venktoren für XDir und YDir erlaubt.

JsgPlane Properties

Pos Nullpunkt der Ebene in der 3D-Welt
XDir, YDir Richtung der X- und Y-Achsen der Ebene in der 3D-Welt
Normal optionaler Normalen-Vektor der Ebene
Result Die Resultate einiger Berechnungen werden hier gespeichert
ResultPoly Die Resultate einiger Berechnungen werden hier gespeichert
ExitPoint Siehe ClipPoly() und ClipArea()
EnterPoint Siehe ClipPoly() und ClipArea()

JsgPlane Funktionen

JsgPlane() Erzeugt eine JsgPlane, welche in den folgenden Funktionen verwendet wird
Ok() Test, ob ein JsgPlane Objekt vorliegt
Set() Ändert die Plane Parameter
Copy() Kopiert eine Ebene
Normalize() Normalisiert die X- und Y-Koordinaten der Ebene
CompNormal() Veranlasst das Berechnen des Normalen-Vektors Normal
PointOnPlane() Berechnet die 3D-Koordinaten eines Punktes einer Ebene
PolygonOnPlane() Berechnet die 3D-Koordinaten eines 2D-Polygons auf einer Ebene
IntersectLine() Berechnet den Schnittpunkt einer Linie mit der Ebene
IsPointOnTop() Gibt true zurück, wenn ein Punkt auf jener Seite der Plane ist, auf welcher der Normal Vektor steht.
IsPoint3DOnTop() Gibt true zurück, wenn ein Punkt auf jener Seite der Plane ist, auf welcher der Normal Vektor steht.
ClipPoly() Clippt Polygone an der Plane
ClipArea() Clippt eine Fläche an der Plane
SavePlane() Speichert eine Kopie von Plane in einem Objekt
SetPlane() Definiert die Ebene, welche in den -OnPlane-Funktionen verwendet werden soll
AddClipPlane() Definiert eine weitere Clip-Plane in der Clip-Plane-Liste
DeleteClipPlanes() Löscht alle Clip-Planes der Clip-Plane-Liste
GetPointOnPlane() Berechnet die 3D Koordinaten eines Punktes auf der Plane
PolygonToPlane() Transformiert ein 2D-Polygon JsgPolygon auf einer Ebene JsgPlane in ein 3D-Polygon JsgPolygon.
AddPointToPolyOnPlane() Fügt einen Punkt auf einer Ebene am Ende des internen Polygons ein
MoveToOnPlane() Bewegt den Zeichenstift ohne zu zeichnen
LineToOnPlane() Zeichnet eine Gerade von der letzten Position
LineOnPlane() Zeichnet eine Linie
PolygonOnPlane() Zeichnet oder füllt ein Polygon
BezierCurveOnPlane() Zeichnet oder füllt eine Bezier-Kurve
BezierCurveToOnPlane() Zeichnet oder füllt eine Bezier-Kurve zu einem Endpunkt
SplineCurveOnPlane() Zeichnet oder füllt eine Spline-Kurve
ArrowOnPlane() Zeichnet eine Linie mit Pfeilen oder anderen Symbolen
PolygonArrowOnPlane() Zeichnet ein Polygon mit Pfeilen oder anderen Symbolen an den Endpunkten
RectOnPlane() Zeichnet ein Rechteck über zwei Eckpunkte
RectWHOnPlane() Zeichnet ein Rechteck über Breite und Höhe
CircleOnPlane() Zeichnet einen Vollkreis
ArcOnPlane() Zeichnet einen Kreisbogen von Start- zu Endwinkel
ArcToOnPlane() Zeichnet einen Kreisbogen zu einem Endpunkt
ArcPtOnPlane() Zeichnet einen Kreisbogen von Start- zu Endpunkt
EllipseOnPlane() Zeichnet eine Ellipse
EllipseArcOnPlane() Zeichnet einen Ellipsenbogen von Start- zu Endwinkel
TextOnPlane() Zeichnet einen Text
GetTextBoxOnPlane() Ermittelt die umschliessende Box für einen Text
MarkerOnPlane() Zeichnet Marker

Für weitere Zeichnen-Funktionen siehe:

JsgPlane.Pos

JsgPlane.Pos: JsgVect3;JsgPlane()

Nullpunkt der Ebene im 3D-Raum.

JsgPlane.XDir, YDir

JsgPlane.XDir: JsgVect3;JsgPlane()
JsgPlane.YDir: JsgVect3;JsgPlane()

Richtung der X- und Y-Achsen der Ebene im 3D-Raum. Bilden diese Achsen keine Rechs-Orthogonal-Basis wird die gezeichnete Grafik auf der Ebene enstprechend verzerrt. Die Achsen können mit der Funktion Normalize() oder dem entsprechenden Parameter bei einigen Funktionen entsprechend korrigiert werden.

JsgPlane.Normal

JsgPlane.Normal: JsgVect3;JsgPlane()

Falls gewünscht kann beim Erzeugen der Plane das Berechnen des Normalen-Vektors veranlasst werden. Der Normalen-Vektor hat nur dann die Länge 1, wenn XDir und YDir die Länge 1 haben und senkrecht aufeinander stehen.

Das Berechnen des Normalen-Vektors kann auch mit der Funktion CompNormal() veranlasst werden.

JsgPlane.Result

JsgPlane.Result: JsgVect3 

Die Resultate einiger Berechnungen werden hier gespeichert, sodass die aufrufende Funktion darauf zugreifen kann:

JsgPlane.ResultPoly

JsgPlane.ResultPoly: JsgPolygon 

Die Resultate einiger Berechnungen werden hier gespeichert, sodass die aufrufende Funktion darauf zugreifen kann:

JsgPlane.ExitPoint, EnterPoint

JsgPlane.ExitPoint: JsgVect3 
JsgPlane.EnterPoint: JsgVect3 

In den Funktionen ClipPoly() und ClipArea() kann eine Funktion übergeben werden, welche Punkte für geclippte Bereiche generiert. Diese Funktion hat über ExitPoint und EnterPoint Zugriff auf die entsprechenden Schnittpunkte des Polygons/Area mit der Plane.

JsgPlane()

new JsgPlane( Pos, XDir, YDir, Normalize )

Pos: JsgVect3
3D-Position des Nullpunktes der Ebene im 3D-Raum.
XDir, YDir: JsgVect3
Richtung der X- und Y-Achsen im 3D-Raum.
Normalize: Boolean; Optional; Default = false
true → Die Vektoren XDir und YDir werden normalisiert und YDir wird so korrigiert, dass er senkrecht zu XDir steht.
CompNormal: Boolean; Optional; Default = false
true → Berechnet den Normalenvektor Normal auf die Ebene
Return: JsgPlane

Erzeugt ein JsgPlane Objekt, welches eine Ebene im Raum repräsentiert. Auf diese Ebene kann mit den JsgPlane Funktionen gezeichnet werden.

Wenn die beiden Vektoren XDir und YDir die Länge 1 haben, senkrecht aufeinander stehen und ein Rechts-System bilden, kann Normalize = false gesetzt werden (default).

JsgPlane.Ok()

global JsgPlane.Ok( Object )

Object: any or undefined
Return: Boolean

Gibt true zurück, wenn Object definiert ist und vom Typ JsgPlane ist.

Ein Objekt ist vom Typ JsgPlane, wenn Object definiert und ein Objekt ist, welches ein Propertiy Pos enthält.

Diese Funktion ist dazu gedacht, Fälle zu unterscheiden, falls eine Funktion verschiedene Argument-Typen akzeptiert.

function myFunc( arg ) {
  if (JsgPlane.Ok(arg)) {
    // handle arg as a JsgPlane
  } else {
    // handle arg as something else
  }
}

JsgPlane.Set()

JsgPlane.Set( Pos, XDir, YDir, Normalize )

Pos: JsgVect3
3D-Position des Nullpunktes der Ebene im 3D-Raum.
XDir, YDir: JsgVect3
Richtung der X- und Y-Achsen im 3D-Raum.
Normalize: Boolean; Optional; Default = false
true → Die Vektoren XDir und YDir werden normalisiert und YDir wird so korrigiert, dass er senkrecht zu XDir steht.

Setzt die Plane-Parameter neu.

Wenn die beiden Vektoren XDir und YDir die Länge 1 haben, senkrecht aufeinander stehen und ein Rechts-System bilden, kann Normalize = false gesetzt werden (default).

Der Parameter Normal wird in jedem Fall berechnet.

JsgPlane.Copy()

JsgPlane.Copy( Normalize )

Normalize: Boolean; Optional; Default = false
true → normalisiert XDir und YDir der Ebene
Return: new JsgPlane()

Erzeugt eine Kopie einer JsgPlane. Wenn Normalize = true gesetzt wird, werden die Achsen XDir und YDir der Kopie normalisiert, siehe Normalize().

JsgPlane.Normalize()

JsgPlane.Normalize( )

Return: JsgPlane
diese Ebene

Wenn die Grafik auf der Ebene unverzerrt gezeichnet werden soll, müssen die Achsen XDir und YDir senkrecht aufeinander stehen und die Länge 1 haben. Dies kann durch Aufruf von Normalize() oder durch Setzen des Parameters Normalize = true bei der Funktion SetPlane() erreicht werden.

Normalize setzt die Längen XDir und YDir auf 1. Die Y-Achse YDir wird senkrecht auf die X-Achse XDir korrigiert. Die Richtung der X-Achse wird also in jedem Fall beibehalten.

Die Funktion gibt die aktuelle normalisierte Ebene als Funktionswert zurück. Damit kann die Funktion mit anderen Plane-Funktionen verkettet werden:

JsgPlane.CompNormal()

JsgPlane.CompNormal( )

Veranlasst das Berechnen des Normalen-Vektors Normal der Ebene. Diese Berechnung kann auch mit dem Konstruktor JsgPlane() veranlasst werden.

Wenn die Ebenen-Vektoren XDir und YDir die Länge 1 haben und senkrecht aufeinander stehen, hat der Normalen-Vektor Normal ebenfalls die Länge 1, sonst nicht.

JsgPlane.PointOnPlane()

JsgPlane.Point( x, y, v )
JsgPlane.Point( p, v )

x, y: Number
XY im Koordinatensystem einer JsgPlane
v: JsgVect2; Optional
Speicher für den berechneten Punkt
p: JsgVect2
Punkt im Koordinatensystem einer JsgPlane
Return v or Result: JsgVect3

Berechnet die 3D-Koordinaten eines Punktes einer Ebene.

JsgPlane.PolygonOnPlane()

JsgPlane.Polygon( xArray, yArray, Size, PlanePoly )
JsgPlane.Polygon( Poly, PlanePoly )

xArray, yArray: Array of Number
XY im Koordinatensystem der JsgPlane
Size: Integer; Optional; Default = xArray.length
Grösse der Arrays
Poly: JsgPolygon
2D-Polygon im Koordinatensystem der JsgPlane
PlanePoly: JsgPolygon; Optional
Speicher für das resultierende Polygon (3D)
Return PlanePoly or ResultPoly: JsgPolygon

Berechnet die 3D-Koordinaten eines 2D-Polygons auf einer Ebene.

JsgPlane.IntersectLine()

JsgPlane.IntersectLine( p1, p2 )

p1, p2: JsgVect3
Zwei Punkte einer 3D-Linie
Return Result or null: JsgVect3

Berechnet den Schnittpunkt der Linie gegeben durch die beiden Punkte p1 und p2 mit der Ebene. Wenn kein Schnittpunkt existiert, d.h. wenn die Linie parallel zur Ebene oder in der Ebene liegt, wird null zurückgegeben. Wenn ein Schnittpunkt existiert, wird er in Result gespeichert und Result wird zurückgegeben.

Beachte: Damit diese Funktion verwendet werden kann, muss der Normalen-Vektor für der Ebene Normal berechnet worden sein und seine Länge muss 1 sein. Siehe Konstruktor JsgPlane() und CompNormal().

Algorithmus: Schnittpunkt Ebene mit Gerade einfach berechnen; Waltis blog

JsgPlane.IsPointOnTop()

JsgPlane.IsPointOnTop( x, y, z )

x, y, z: Number
Punkt-Koordinaten
Return: Boolean
true → Punkt liegt auf der Oberseite der Plane

Gibt true zurück, wenn der Punkt (x,y,z) auf der Oberseite oder auf der JsgPlane liegt. Die Oberseite ist jene Seite der Plane, auf welcher der Normal Vektor steht, d.h. von ihr weg zeigt.

Require: Der Normalen-Vektor Normal muss berechnet sein, siehe JsgPlane().

JsgPlane.IsPoint3DOnTop()

JsgPlane.IsPoint3DOnTop( p )

p: JsgVect3
Return: Boolean
true → Punkt liegt auf der Oberseite der Plane

Gibt true zurück, wenn der Punkt p auf der Oberseite oder auf der JsgPlane liegt. Die Oberseite ist jene Seite der Plane, auf welcher der Normal Vektor steht, d.h. von ihr weg zeigt.

Require: Der Normalen-Vektor Normal muss berechnet sein, siehe JsgPlane().

JsgPlane.ClipPoly()

JsgPlane.ClipPoly( Polys, ClippedPolyList, InterpolFunc, InterpolData )

Polys: JsgPolygon or JsgPolygonList
ClippedPolyList: JsgPolygonList
InterpolFunc: Function(this,ClippedPolyList,InterpolData); Optional
InterpolData: Object; Optional

Clippt das Polygon oder alle Polygone in PolyList an dieser Plane und speichert die resultierenden Polygone in ClippedPolyList ab. ClippedPolyList muss von der aufrufenden Funktion übergeben werden und allenfalls mit Reset() gelöscht werden.

Wenn InterpolFunc definiert ist, wird für jeden Bereich der Polygone, die ausserhalb der Clip-Plane liegen, diese Funktion aufgerufen. Diese Funktion kann dann für diesen Bereich eigene Punkte generieren. InterpolFunc hat über this Zugriff auf die Schnittpunkte eines Polygons mit der Plane ExitPoint und EnterPoint. Der Funktion wird ausserdem InterpolData übergeben, in welchem die aufrufende Funktion weitere Daten übergeben kann.

JsgPlane.ClipArea()

JsgPlane.ClipPoly( Polys, ClippedPolyList, InterpolFunc, InterpolData )

Polys: JsgPolygon or JsgPolygonList
ClippedPolyList: JsgPolygonList
InterpolFunc: Function(this,ClippedPolyList,InterpolData); Optional
InterpolData: Object; Optional

Clippt das Polygon oder alle Polygone, welche eine Area ausmachen, in PolyList an dieser Plane und speichert das resultierenden Area-Polygon in ClippedPolyList ab. ClippedPolyList muss von der aufrufenden Funktion übergeben werden und allenfalls mit Reset() gelöscht werden.

Wenn InterpolFunc definiert ist, wird für jeden Bereich der Polygone, die ausserhalb der Clip-Plane liegen, diese Funktion aufgerufen. Diese Funktion kann dann für diesen Bereich eigene Punkte generieren. InterpolFunc hat über this Zugriff auf die Schnittpunkte eines Polygons mit der Plane ExitPoint und EnterPoint. Der Funktion wird ausserdem InterpolData übergeben, in welchem die aufrufende Funktion weitere Daten übergeben kann.

JsGraph3D.SavePlane()

JsGraph3D.SavePlane( Params )

Params: Object
Falls definiert wird eine Referenz auf Plane im Property Plane dieses Objekts gespeichert. Sonst wird Plane im Property Plane eines neuen Objekts gespeichert.
Return: Object or Params

Speichert eine Referenz auf Plane in ein Objekt.

Wenn Params definiert und ein Objekt ist, wird Plane in diesem Objekt abgespeichert. Wenn Params kein Objekt ist, wird intern ein neues Objekt zum Speichern von Plane erzeugt. Das neue Objekt wird als Returnwert zurückgegeben.

Die Plane, d.h. eine Referenz darauf, wird im Property Plane des Objektes gespeichert und kann mit SetPlane() wieder dem JsGraph3D.Plane zugewiesen werden.

JsGraph3D.SetPlane()

JsGraph3D.SetPlane( Pos, XDir, YDir, Normalize )
JsGraph3D.SetPlane( Plane )
JsGraph3D.SetPlane( Params )

Pos: JsgVect3
Nullpunkt der Ebene im 3D-Raum
XDir: JsgVect3
Richtung der X-Achse der Ebene im 3D-Raum
YDir: JsgVect3
Richtung der Y-Achse der Ebene im 3D-Raum
Plane: JsgPlane
Params: { Plane: JsgPlane, ... }
Normalize: Boolean; Optional; Default = false
true → normalisiert XDir und YDir der Ebene

Mit SetPlane wird die Ebene Plane für die folgenden -OnPlane-Funktionen definiert. Es kann entweder eine mit new JsgPlane() erzeugte Ebene übergeben werden oder es können die Parameter Pos, XDir und YDir für eine intern erzeugte Ebene übergeben werden.

Wenn die Grafik auf der Ebene unverzerrt gezeichnet werden soll, müssen die Achsen XDir und YDir senkrecht aufeinander stehen und die Längen 1 haben. Dies kann durch setzen von Normalize = true erreicht werden. Dabei wird die Y-Achse senkrecht auf die X-Achse korrigiert. Die Richtung der X-Achse wird also in jedem Fall beibehalten.

Mit der Funktion SaveAll() und SavePlane() kann eine Referenz auf die Ebene Plane in einem Objekt der Form Params gespeichert werden. Mit SetAll() und SetPlane() kann die Plane aus diesem Objekt wieder eingelesen werden.

JsGraph3D.AddClipPlane()

JsGraph3D.AddClipPlane( pos, xdir, ydir )
JsGraph3D.AddClipPlane( plane )

pos: JsgVect3
Ursprung der Clip-Ebene
xdir: JsgVect3
Richtung der X-Koordinaten
ydir: JsgVect3
Richtung der Y-Korrdinaten
plane: JsgPlane
Clip-Ebene

Fügt der Clip-Plane-Liste eine weitere Clip-Plane hinzu.

Es können beliebig viele Clip-Planes definiert werden. Alle Grafik wird an allen Clip-Planes geclippt. Für die Kamera existiert eine separate Clip-Plane, welche mit SetCameraClipping() aktiviert werden kann.

Eine Clip-Plane hat einen Normalen-Vektor, der aus xdir und ydir über das Vektor-Produkt (siehe JsgVect3.Mult()) berechnet wird. Grafik, die auf der Seite der Ebene liegt, in welche dieser Vektor zeigt, wird gezeichnet. Grafik auf der anderen Seite wird geclippt.

Bei der ersten Variante von AddClipPlane() wird mit JsgPlane() eine JsgPlane erzeugt, wobei der Parameter Normalize = true gesetzt wird.

Die plane bei der zweiten Variante wird mit JsgPlane.Normalize() normalisiert und direkt in die Clip-Plane-Liste eingefügt. Es wird keine Kopie erstellt.

Verwende DeleteClipPlanes() um die Clip-Plane-Liste zu löschen.

JsGraph3D.DeleteClipPlanes()

JsGraph3D.DeleteClipPlanes( )

Löscht die Clip-Plane-Liste. Nicht mehr referenzierte Clip-Planes werden vom System gelöscht. Die Clip-Plane der Kamera wird nicht gelöscht. Verwende dazu die Funktion SetCameraClipping().

JsGraph3D.GetPointOnPlane()

JsGraph3D.GetPointOnPlane( x, y, vect )

x, y: Number
vect: JsgVect3 or undefined
Return vect or this.WorkPoint3D: ''''

Berechnet die 3D-Korrdinaten des Punktes (x,y) auf der Plane.

JsGraph3D.PolygonToPlane()

JsGraph3D.PolygonToPlane( Xpoly, Ypoly, Size, PlanePoly )
JsGraph3D.PolygonToPlane( Poly, PlanePoly )

Xpoly, Ypoly: Array of Number
Polygon im Koordinatensystem der Plane
Size: Integer(>=0); Optional; Default = Xpoly.length
Poly: JsgPolygon
Polygon im Koordinatensystem der Plane
PlanePoly: JsgPolygon; Optional; Default = Plane.ResultPoly
Polygon, in dem die Koordinaten gespeichert werden sollen
Return: PlanePoly or Plane.ResultPoly

Transformiert das Polygon (Xpoly,Ypoly) bzw. Poly von Koordinaten bezüglich der Ebene Plane in ein 3D-Polygon. Wenn PlanePoly nicht definiert ist, wird das interne Polygon Plane.ResultPoly zum Speichern des Plane-Polygons verwendet. Achtung, dieses Polygon wird durch den Aufruf von anderen OnPlane-Funktionen dieses Moduls überschrieben. 3D-Zeichenfunktionen überschreiben das interne ResultPolygon nicht.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.AddPointToPolyOnPlane()

JsGraph3D.AddPointToPolyOnPlane( x, y )
JsGraph3D.AddPointToPolyOnPlane( p )

x, y: Number
Koordinaten bezüglich der JsgPlane
p: JsgVect2
Koordinaten bezüglich der JsgPlane

Fügt einen Punkt auf der Ebene Plane am Ende des internen Polygons ein. Das interne Polygon kann zum punktweisen Aufbau eines Polygons verwendet werden. Dies ist effizienter als die Verwendung der Funktionen MoveToOnPlane() und LineToOnPlane().

g.NewPoly();
for (var x = 0; x <= xMax; x += xDelta) {
  var y = f(x);
  g.AddPointToPolyOnPlane( x, y );
}
g.DrawPoly();

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.MoveToOnPlane()

JsGraph3D.MoveToOnPlane( x, y )
JsGraph3D.MoveToOnPlane( p )

x, y: Number
Koordinaten bezüglich der Plane
p: JsgVect2
Koordinaten bezüglich der JsgPlane

Positioniert den Zeichenstift (Pen) bei den Plane-Koordinaten (x, y) und setzt den Zeichenstift ab (PenDown = true). Von der letzten Position (LastX, LastY) wird keine Linie zur Position (x,y) gezeichnet.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.LineToOnPlane()

JsGraph3D.LineToOnPlane( x, y )
JsGraph3D.LineToOnPlane( p )

x, y: Number
Koordinaten bezüglich der Plane
p: JsgVect2
Koordinaten bezüglich der JsgPlane

Zeichnet eine gerade Linie von der letzten Pen-Position (LastX, LstX) zu den Koordinaten (x, y) und setzt den Pen an dieser Position ab, d.h. LastX wird zu x und LastY wird zu y.

Wenn vor dem Aufruf von LineToOnPlane die Funktion PenUp() gerufen wurde, wird keine Linie gezeichnet, sondern nur der Pen an die Position (x, y) bewegt und abgesetzt (entspricht MoveToOnPlane()).

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern die Linie wird im Pfad gespeichert.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.LineOnPlane()

JsGraph3D.LineOnPlane( x1, y1, x2, y2, Append )
JsGraph3D.LineOnPlane( p1, p2, Append )

x1, y1, x2, y2: Number
Koordinaten bezüglich der Plane
p1, p2: JsgVect2
Koordinaten bezüglich der Plane
Append: Boolean; Optional; Default = false
true → verbindet den ersten Punkt der Linie mit dem letzten Punkt im Pfad

Zeichnet auf der JsgPlane eine gerade Linie vom Punkt (x1, y1) zum Punkt (x2, y2) und setzt den Pen bei (x2, y2) ab.

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern die Linie wird im Pfad gespeichert. Wenn append = true ist, wird zusätzlich eine Linie vom letzten Punkt im Pfad zum ersten Punkt dieser Linie im Pfad gespeichert.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.PolygonOnPlane()

JsGraph3D.PolygonOnPlane( Xpoly, Ypoly, Mode, Size, RoundedEdges )
JsGraph3D.PolygonOnPlane( Poly, Mode, RoundedEdges )

Xpoly, Ypoly: array of Number
Koordinaten bezüglich der Plane
Poly: JsgPolygon
Koordinaten bezüglich der Plane
Mode: Integer(1..15); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert
Size: Inetger(>0); Optional; Default = Xpoly.length
Anzahl Koordinaten in Xpoly und Ypoly
RoundedEdges: Boolean; Optional; Default = false
Mode Beschreibung
1 Polygonzug zeichnen
2 Polygon füllen
4 Polygon Anfangs- und Endpunkt verbinden (Polygon schliessen)
8 Polygon an bisherigen Pfad anhängen

Die Werte von Mode können durch Addition kombiniert werden.

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern das Polygon wird im Pfad gespeichert. Durch Wahl des Mode 8 kann erreicht werden, dass eine Linie vom Ende des bisher gespeicherten Pfades zum Anfang des Polygons im Pfad gespeichert wird, also das Polygon an den bisherigen Pfad angefügt wird, ohne eine neue Kontur zu beginnen.

Wenn RoundedEdges = true ist, werden die Ecken und Endpunkte des Polygons gerundet, unabhängig von den aktuellen Einstellungen von LineJoin und LineCap. Letztere werden von dieser Funktion nicht verändert.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.BezierCurveOnPlane()

JsGraph3D.BezierCurveOnPlane( sx, sy, cx1, cy1, cx2, cy2, ex, ey, mode, nSegments )
JsGraph3D.BezierCurveOnPlane( sp, cp1, cp2, ep, mode, nSegments )
JsGraph3D.BezierCurveOnPlane( poly, mode, startIx, nSegments )

sx, sy: Number
Koordinaten des Startpunktes bezüglich der Plane
sp: JsgVect2
Koordinaten des Startpunktes bezüglich der Plane
cx1, cy1: Number
Kontrollpunkt für (sx,sy)
cp1: JsgVect2
Kontrollpunkt für sp
cx2, cy2: Number
Kontrollpunkt für (ex,ey)
cp2: JsgVect2
Kontrollpunkt für ep
ex, ey: Number
Endpunkt
ep: JsgVect2
Endpunkt
poly: JsgPolygon
Polygon, welches die vier Punkte der Kurve enthält
mode: Integer(1..15); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert
startIx: Integer(>=0); Optional; Default = 0
specifies first point to use from poly
nSegments: Integer(>1); Optional; Default = NumBezierSegments
Return this: JsGraphX3D
mode Beschreibung
1 Bezier-Kurve (Umriss) zeichnen
2 Bezier-Kurve füllen
4 Bezier-Kurve schliessen, indem eine Linie vom Endpunkt zum Anfangspunkt angehängt wird
8 Bezier-Kurve an bisherigen Pfad anhängen

Zeichnet und/oder füllt eine Bezier-Kurve auf der Ebene Plane. Eine Bezier-Kurve ist eine geschwungene Kurve zwischen den beiden Punkten (sx,sy) und (ex,ey) bzw. sp und ep. Mit den beiden Kontrollpunkten kann der Verlauf der Kurve zwischen Start- und Endpunkt bestimmt werden.

Die Bits in obiger Tabelle können einfach durch Addition zu der Bitmaske von mode zusammengesetzt werden. Wenn also zum Beispiel die Bezier-Kurve geschlossen und gefüllt werden soll und gleichzeitig auch die Kontur der Fläche gezeichnet werden soll, so muss mode = 1 + 2 + 4 gesetzt werden.

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern die Bezier-Kurve wird im Pfad gespeichert. Durch setzen des Bit 8 in mode kann erreicht werden, dass eine Linie vom Ende des bisher gespeicherten Pfades zum Anfang der Bezier-Kurve im Pfad eingefügt wird, also die Bezier-Kurve an den bisherigen Pfad angefügt wird, ohne eine neue Kontur zu beginnen.

Eine längere Bezier-Kurve kann durch anhängen weiterer Bezier-Kurve-Segemente mit BezierCurveTo() gezeichnet werden.

JsGraph3D.BezierCurveToOnPlane()

JsGraph3D.BezierCurveToOnPlane( cx1, cy1, cx2, cy2, ex, ey, mode, nSegments )
JsGraph3D.BezierCurveToOnPlane( cp1, cp2, ep, mode, nSegments )
JsGraph3D.BezierCurveToOnPlane( poly, mode, startIx, nSegments )

cx1, cy1: Number
Kontrollpunkt für (LastX,LastY)
cp1: JsgVect2
Kontrollpunkt für (LastX,LastY)
cx2, cy2: Number
Kontrollpunkt für (ex,ey)
cp2: JsgVect2
Kontrollpunkt für (ex,ey)
ex, ey: Number
Endpunkt
ep: JsgVect2
Endpunkt
poly: JsgPolygon
Polygon, welches die drei Punkte der Kurve enthält
mode: Integer(1..7); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert
startIx: Integer(>=0); Optional; Default = 0
specifies first point to use from poly
nSegments: Integer(>1); Optional; Default = NumBezierSegments
Return this: JsGraph3D
mode Beschreibung
1 Bezier-Kurve (Umriss) zeichnen
2 Bezier-Kurve füllen
4 Bezier-Kurve schliessen, indem eine Linie vom Endpunkt zum Anfangspunkt angehängt wird

Zeichnet und/oder füllt eine Bezier-Kurve auf der Ebene Plane vom letzten Punkt (LastX,LastY) aus. Eine Bezier-Kurve ist eine geschwungene Kurve zwischen den beiden Punkten (LastX,LastY) und (ex,ey) bzw. ep. Mit den beiden Kontrollpunkten kann der Verlauf der Kurve zwischen Start- und Endpunkt bestimmt werden. Siehe auch BezierCurve().

Die Bits in obiger Tabelle können einfach durch Addition zu der Bitmaske von mode zusammengesetzt werden. Wenn also zum Beispiel die Bezier-Kurve geschlossen und gefüllt werden soll und gleichzeitig auch die Kontur der Fläche gezeichnet werden soll, so muss mode = 1 + 2 + 4 gesetzt werden.

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern die Bezier-Kurve wird im Pfad gespeichert.

JsGraph3D.SplineCurveOnPlane()

JsGraph3D.SplineCurveOnPlane( xArray, yArray, tension, mode, size, nSegments )
JsGraph3D.SplineCurveOnPlane( poly, tension, mode, nSegments )

xArray, yArray: Array[ ] of Number
Koordinaten der Stützpunkte bezüglich der Plane
poly: JsgPolygon
Koordinaten der Stützpunkte bezüglich der Plane
tension: Number; Optional; Default = 0.5
Beeinflusst den Verlauf des Splines durch die Stützpunkte
mode: Integer(1..63); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert
size: Integer(>0); Optional; Default = xArray.length
Optional Anzahl zu Zeichnende Punkte
nSegments: Integer(>1); Optional; Default = NumBezierSegments
Return WorkPoly: JsgPolygon
mode Beschreibung
1 Spline-Kontur zeichnen
2 Spline-Kontur füllen
4 geschlossenen Spline durch die Stützpunkte zeichnen
8 Spline an bisherigen Pfad anhängen
16 Erstes Segment nicht zeichnen wenn Spline nicht geschlossen ist
32 Letztes Segment nicht zeichnen, wenn Spline nicht geschlossen ist
64 gesetzt → Endpunkte sind Spline-Kontrolpunkte; nicht gesetzt → Endpunkte sind Bezier-Kontrolpunkte

Zeichnet und/oder füllt eine Spline-Kurve. Eine Spline-Kurve ist eine geschwungene Kurve, die durch alle Punkte in (xArray, yArray) bzw. poly geht. Zwischen je zwei Punkten wird eine kubische Bezier-Kurve berechnet und gezeichnet. Die Stützpunkte der Bezier-Kurven und somit der Spline-Verlauf kann mit dem Parameter tension beeinflusst werden. Der beste Wert für eine straffe Kurve mit möglichst wenig Kanten ist tension = 0.5. Auf der Test-Seite Jsg Test: SplineCurve kannst du den Einfluss von tension ausprobieren.

Die Bits in obiger Tabelle können einfach durch Addition zu der Bitmaske von mode zusammengesetzt werden. Wenn also zum Beispiel die Spline-Kurve geschlossen und gefüllt werden soll und gleichzeitig auch die Kontur der Fläche gezeichnet werden soll, so muss mode = 1 + 2 + 4 gesetzt werden. Wenn die Bits 1 und 2 nicht gesetzt werden, wird die Kurve nicht gezeichnet, jedoch die berechneten Bezier-Segmente werden im Rückgabewert WorkPoly zurückgegeben. Das WorkPoly kann dann mit BezierCurve() segmentweise gezeichnet, wobei z.B. jedem Segment eine andere Farbe zugeordnet werden könnte.

Bei offenen Splines wird der Kontrollpunkt des ersten und letzten Stützpunktes gleich dem entsprechenden Punkt gesetzt. Das bedeutet, dass die Richtung der Kurve an diesen Punkten nicht separat beeinflusst werden kann, sondern von den benachbarten Punkten abhängig ist. Wenn man die Richtung an diesen Stützpunkten festlegen will, kann man am Anfang und/oder am Ende des Splines einen zusätzlichen Stützpunkt einfügen. Mit den Flags 16 und 32 kann man das so zusätzlich berechnete erste und letzte Segment des Splines beim Zeichnen auslassen. So kann man einen Spline erstellen, bei dem die Richtung des ersten und letzten gezeichneten Stützpunktes durch die beiden zusätzlichen nicht gezeichneten Segmente beeinflussen kann. Man kann auch nur am Anfang oder nur am Ende einen zusätzlichen Stützpunkt festlegen. Der Start-/End-Kontrolpunkt kann entweder ein Bezier-Kontrolpunkt sein (Flag 64 ist nicht gesetzt) oder ein Spline-Kontrolpunkt (Flag 64 ist gesetzt). Der letzte Fall entspricht einem normalen Spline, bei dem das erste und letzte Segment nicht gezeichnet werden, falls das entsprechende Flag 16 bzw. 32 gesetzt ist. Im WorkPoly sind diese Segmente jedoch enthalten.

Wenn der Pfad offen ist (siehe OpenPath()), so wird nicht gezeichnet, sondern die Spline-Kurve wird im Pfad gespeichert. Durch setzen des Bit 8 in mode kann erreicht werden, dass eine Linie vom Ende des bisher gespeicherten Pfades zum Anfang der Bezier-Kurve im Pfad eingefügt wird, also die Spline-Kurve an den bisherigen Pfad angefügt wird, ohne eine neue Kontur zu beginnen.

JsGraph3D.ArrowOnPlane()

JsGraph3D.ArrowOnPlane( x1, y1, x2, y2, Variant, Mode, sym1, sym2 )
JsGraph3D.ArrowOnPlane( p1, p2, Variant, Mode, sym1, sym2 )

x1, y1, x2, y2: Number
Koordinaten bezüglich der Plane.
p1, p2: JsgVect2
Koordinaten bezüglich der Plane.
Variant: Integer(1..15); Optional; Default = 1
Bitmaske die angibt, an welchem Ende der Linie ein Pfeil gezeichnet werden soll und ob die Linie selbt gezeichnet werden soll
Mode: Integer(1..15); Optional; Default = 3
Bitmaske die verschiedene Modi steuert
sym1, sym2: String; Optional
Start- und End-Symbol
Variant Beschreibung
1 Pfeil oder Markersymbol am Ende der Linie zeichnen
2 Pfeil oder Markersymbol am Anfang der Linie zeichnen
4 Linie nicht zeichnen nur die Smybole (falls Bit 1/2 gesetzt)
8 Linie an Enden mit Symbol um 1/2 Strichdicke verkürzen
Mode Beschreibung
1 (Pfeil)-Markerkontur zeichnen
2 (Pfeil)-Marker füllen
8 Linie an bisherigen Pfad anhängen

Um mehrere Variant und Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Zeichnet eine Linie mit einem Symbol (z.B. einem Pfeil) an einem oder beiden Enden auf die Ebene plane. Das Symbol, die Farben und Strichdicken können mit SetMarkerAttr() gesetzt werden. Das Marker-Symbol wird in die Richtung der Linie gedreht.

Die Symbole können auch mit den Parametern sym1 und sym2 ausgewählt werden. Wenn nur sym1 angegeben wird, wird sym1 für beide Enden verwendet, abhängig von variant.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.PolygonArrowOnPlane()

JsGraph3D.PolygonArrowOnPlane( xArray, yArray, Variant, LineMode, ArrowMode, Size, sym1, sym2 )
JsGraph3D.PolygonArrowOnPlane( Poly, Variant, LineMode, ArrowMode, sym1, sym2 )

xArray, yArray: Array[ ] of Number
Koordinaten bezüglich der Plane
Poly: JsgPolygon
Koordinaten bezüglich der Plane
Variant: Integer(1..15); Optional; Default = 1
Bitmaske die angibt, an welchem Ende der Linie ein Pfeil gezeichnet werden soll und ob die Linie selbt gezeichnet werden soll
LineMode: Integer(1..15); Optional; Default = 1
Bitmaske, die verschiedene Linien-Modi steuert
ArrowMode: Integer(1..3); Optional; Default = 3
Bitmaske, die verschiedene Pfeil-Modi steuert
Size: Inetger(>0); Optional; Default = Xpoly.length
Anzahl Koordinaten in Xpoly und Ypoly
sym1, sym2: String; Optional
Start- und End-Symbol
Variant Beschreibung
1 Pfeil oder Markersymbol am Ende der Linie zeichnen
2 Pfeil oder Markersymbol am Anfang der Linie zeichnen
4 Linie nicht zeichnen nur die Smybole (falls Bit 1/2 gesetzt)
8 Linie an Enden mit Symbol um 1/2 Strichdicke verkürzen
LineMode Beschreibung
1 Polygonkontur zeichnen
2 Polygon füllen
4 Polygon Anfangs- und Endpunkt verbinden (Polygon schliessen)
8 Linie an bisherigen Pfad anhängen
ArrowMode Beschreibung
1 (Pfeil)-Markerkontur zeichnen
2 (Pfeil)-Marker füllen

Um mehrere Variant und Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Zeichnet ein Polygon mit einem Symbol (z.B. einem Pfeil) an einem oder beiden Enden auf die Ebene Plane. Das Symbol, die Farben und Strichdicken können mit SetMarkerAttr() gesetzt werden. Das Marker-Symbol wird in die Richtung der Linie gedreht.

Die Symbole können auch mit den Parametern sym1 und sym2 ausgewählt werden. Wenn nur sym1 angegeben wird, wird sym1 für beide Enden verwendet, abhängig von variant.

Wenn das Polygon aus weniger als 2 Punkten besteht, wird nichts gezeichnet. Wenn die ersten beiden Punkte identisch sind, kann kein Pfeil am Start des Polygons gezeichnet werden. Wenn die letzten beiden Punkte identisch sind, kann kein Pfeil am Ende des Polygons gezeichnet werden.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.RectOnPlane()

JsGraph3D.RectOnPlane( Rect, Mode, Roll )
JsGraph3D.RectOnPlane( x1, y1, x2, y2, Mode, Roll )
JsGraph3D.RectOnPlane( p1, p2, Mode, Roll )
JsGraph3D.RectOnPlane( { xmin, ymin, xmax, ymax }, Mode, Roll )

Rect: JsgRect
x1, y1, x2, y2: Number
Koordinaten zweier diagonal gegnüberliegender Eckpunkte bezüglich der Plane.
p1, p2: JsgVect2
Koordinaten zweier diagonal gegnüberliegender Eckpunkte bezüglich der Plane.
Mode: Integer(1..15); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert:
Roll: Integer; Optional; Default = 0
Rotiert die Punkte des Rechtecks und definiert so den ersten und letzten Punkt
Mode Beschreibung
1 Rechteck Umriss zeichnen
2 Rechteck füllen
4 Umlaufsinn des Rechteck umkehren (nur wenn Pfad offen ist)
8 Rechteck an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Wenn das Rechteck Teil einer komplexen Fläche mit Löchern ist, muss eventuell sein Umlaufsinn invertiert werden.

Mit Roll kann bestimmt werden, welcher Punkt des Rechtecks der erste des Polygons sein soll. Ist Roll = 0, ist der Rechteck-Punkt (x1,y1) der erste und letzte Punkt des Polygons. Wenn Roll = 1 ist, wird das Polygon so rotiert, dass der zweite Punkt zum ersten Punkt wird usw. Damit wird der Rechteck-Punkt (x2,y1) zum ersten Punkt des Polygons. Mit Mode 4 wird danach zusätzlich der Umlaufsinn invertiert.

Hinweis: Das Rechteck wird mit der Funktion MakeRectPolygon() erzeugt und mit PolygonOnPlane() gezeichnet.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.RectWHOnPlane()

JsGraph3D.RectWHOnPlane( Rect, Mode, Roll )
JsGraph3D.RectWHOnPlane( x, y, w, h, Mode, Roll )

Rect: JsgRect
x, y: Number
Koordinaten bezüglich der Plane. Bei diesem Punkt handelt es sich immer um den Eckpunkt des Rechtecks mit den niedrigsten oder negativsten Werten.
w, h: Number(>0)
Breite und Höhe des Rechtecks.
Mode: Integer(1..15); Optional; Default = 1
Bitmaske, die verschiedene Modi steuert:
Roll: Integer; Optional; Default = 0
Rotiert die Punkte des Rechtecks und definiert so den ersten und letzten Punkt
Mode Beschreibung
1 Rechteck Umriss zeichnen
2 Rechteck füllen
4 Umlaufsinn des Rechteck umkehren (nur wenn Pfad offen ist)
8 Rechteck an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Wenn das Rechteck Teil einer komplexen Fläche mit Löchern ist, muss eventuell sein Umlaufsinn invertiert werden.

Mit Roll kann bestimmt werden, welcher Punkt des Rechtecks der erste des Polygons sein soll. Ist Roll = 0, ist der Rechteck-Punkt (x,y) der erste und letzte Punkt des Polygons. Wenn Roll = 1 ist, wird das Polygon so rotiert, dass der zweite Punkt zum ersten Punkt wird usw. Damit wird der Rechteck-Punkt (x+w,y) zum ersten Punkt des Polygons. Mit Mode 4 wird danach zusätzlich der Umlaufsinn invertiert.

Hinweis: Das Rechteck wird mit der Funktion MakeRectPolygon() erzeugt und mit PolygonOnPlane() gezeichnet.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.CircleOnPlane()

JsGraph3D.CircleOnPlane( x, y, r, Mode, StartAngle )
JsGraph3D.CircleOnPlane( c, r, Mode, StartAngle )

x, y: Number
Zentrum in Koordinaten bezüglich der Plane.
c: JsgVect2
Zentrum in Koordinaten bezüglich der Plane.
r: Number
Radius des Kreises: r >= 0 → Gegenuhrzeigersinn, r < 0 → Uhrzeigersinn
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
StartAngle: Number; Optional; Default = 0
Startwinkel, von dem aus der Kreis gezeichnet wird, in Grad oder Radian
Mode Beschreibung
1 Kreis-Umriss zeichnen
2 Kreis füllen
4 keine Bedeutung (Polygon schliessen)
8 Kreis an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Wenn der Kreis Teil einer komplexen Fläche mit Löchern ist, muss eventuell sein Umlaufsinn invertiert werden, indem ein negativer Radius r verwendet wird.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.ArcOnPlane()

JsGraph3D.ArcOnPlane( x, y, r, start, end, Mode )
JsGraph3D.ArcOnPlane( c, r, start, end, Mode )

x, y: Number
Zentrum in Koordinaten bezüglich der Plane.
c: JsgVect2
Zentrum in Koordinaten bezüglich der Plane.
r: Number
Radius des Kreises: r >= 0 → Gegenuhrzeigersinn, r < 0 → Uhrzeigersinn
start: Number
Startwinkel des Kreisbogens in Grad oder Radian
end: Number
Endwinkel des Kreisbogens in Grad oder Radian
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
Mode Beschreibung
1 Kreisbogen-Umriss zeichnen
2 Kreisbogen füllen
4 Eine Linie vom Endpunkt zum Anfangspunkt des Kreisbogens anfügen
8 Kreisbogen an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.ArcToOnPlane()

JsGraph3D.ArcToOnPlane( x, y, r, big, Mode )
JsGraph3D.ArcToOnPlane( p, r, big, Mode )

x, y: Number
Zielpunkt des Kreisbogens auf der Plane
p: JsgVect2
Zielpunkt des Kreisbogens auf der Plane
r: Number
Radius des Kreises: r >= 0 → Gegenuhrzeigersinn, r < 0 → Uhrzeigersinn
big: Boolean; Optional; Default = false
Wahl, ob kleiner oder grosser Bogen
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
Mode Beschreibung
1 Kreisbogen-Umriss zeichnen
2 Kreisbogen füllen
4 Eine Linie vom Endpunkt zum Anfangspunkt des Kreisbogens anfügen
8 Kreisbogen an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Zeichnet einen Kreisbogen vom letzten Punkt (LastX, LastY) zum Punkt (x, y). Beim Konstruieren eines Kreises zwischen zwei Punkten gibt es zwei Lösungen. Für Kreisbögen zwischen zwei Punkten gibt es sogar vier Lösungen. Zwei der Lösungen werden durch den Umlaufsinn (Vorzeichen von r) gewählt. Dabei bleibt immer ein grosser und ein kleiner Kreisbogen übrig. Mit big kann man einen dieser Bogen auswählen.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.ArcPtOnPlane()

JsGraph3D.ArcPtOnPlane( x1, y1, x2, y2, r, big, Mode )
JsGraph3D.ArcPtOnPlane( p1, p2, r, big, Mode )

x1, y1: Number
Startpunkt des Kreisbogens auf der Plane
x2, y2: Number
Endpunkt des Kreisbogens auf der Plane
p1, p2: JsgVect2
Start-/Endpunkt des Kreisbogens auf der Plane
r: Number
Radius des Kreises: r >= 0 → Gegenuhrzeigersinn, r < 0 → Uhrzeigersinn
big: Boolean; Optional; Default = false
Wahl, ob kleiner oder grosser Bogen
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
Mode Beschreibung
1 Kreisbogen-Umriss zeichnen
2 Kreisbogen füllen
4 Eine Linie vom Endpunkt zum Anfangspunkt des Kreisbogens anfügen
8 Kreisbogen an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Zeichnet einen Kreisbogen vom Punkt (x1, y1) zum Punkt (x2, y2). Beim Konstruieren eines Kreises zwischen zwei Punkten gibt es zwei Lösungen. Für Kreisbögen zwischen zwei Punkten gibt es sogar vier Lösungen. Zwei der Lösungen werden durch den Umlaufsinn (Vorzeichen von r) gewählt. Dabei bleibt immer ein grosser und ein kleiner Kreisbogen übrig. Mit big kann man einen dieser Bogen auswählen.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.EllipseOnPlane()

JsGraph3D.EllipseOnPlane( x, y, rx, ry, rot, Mode, StartAngle )
JsGraph3D.EllipseOnPlane( c, rx, ry, rot, Mode, StartAngle )

x, y: Number
Zentrum in Koordinaten des Ellipsenzentrums bezüglich der Plane
c: JsgVect2
Zentrum in Koordinaten des Ellipsenzentrums bezüglich der Plane
rx: Number
X-Radius der Ellipse: rx >= 0 → Gegenuhrzeigersinn, rx < 0 → Uhrzeigersinn
ry: Number
Y-Radius der Ellipse
rot: Number
Rotationswinkel der Ellipse in Grad oder Radian
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
StartAngle: Number; Optional; Default = 0
Startwinkel, von dem aus die Ellispe gezeichnet wird, in Grad oder Radian
Mode Beschreibung
1 Ellipsen-Umriss zeichnen
2 Ellipse füllen
4 keine Bedeutung (Polygone schliessen)
8 Ellipse an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Um mehrere Mode Einstellungen zu kombinieren, müssen einfach die enstrechenden Werte der Tabelle addiert werden.

Der Radius rx ist der Radius in die horizontale Richtung der nicht rotierten Ellipse, ry entsprechend der Radius in der vertikalen Richtung. rot rotiert die ganze Ellipse um einen Winkel bezüglich der horizontalen Achse im Gegenuhrzeigersinn, wenn rot positiv ist.

Wenn die Ellipse Teil eines Pfades ist und das Mode Bit 8 gesetzt ist, wird eine Linie vom letzten Punkt des Pfades zur Ellipse gezeichnet. Mit StartAngle kann definiert werden, an welchem Punkt der Ellipse die Linie andocken soll. StartAngle wird von der grossen Halbachse der Ellipse aus im Gegenuhrzeigersinn gemessen.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.EllipseArcOnPlane()

JsGraph3D.EllipseArcOnPlane( x, y, rx, ry, rot, start, end, Mode )
JsGraph3D.EllipseArcOnPlane( c, rx, ry, rot, start, end, Mode )

x, y: Number
Zentrum in Koordinaten des Ellipsenzentrums bezüglich der Plane
c: JsgVect2
Zentrum in Koordinaten des Ellipsenzentrums bezüglich der Plane
rx: Number
X-Radius der Ellipse: rx >= 0 → Gegenuhrzeigersinn, rx < 0 → Uhrzeigersinn
ry: Number
Y-Radius der Ellipse
rot: Number
Rotationswinkel der Ellipse in Grad oder Radian
start: Number
Startwinkel des Ellipsenbogens in Grad oder Radian
end: Number
Endwinkel des Ellipsenbogens in Grad oder Radian
Mode: Integer(1..15); Optional; Default = 1
Bitmaske bestimmt die Zeichenmodi
Mode Beschreibung
1 Ellipsen-Umriss zeichnen
2 Ellipse füllen
4 keine Bedeutung (Polygone schliessen)
8 Ellipse an bisherige Pfad-Kontur anknüpfen, keine neue Kontur beginnen

Der Radius rx ist der Radius in die horizontale Richtung der nicht rotierten Ellipse, ry entsprechend der Radius in der vertikalen Richtung. rot rotiert den ganzen Ellipsenbogen um einen Winkel bezüglich der horizontalen Achse im Gegenuhrzeigersinn bei positivem Wert.

start und end Winkel beziehen sich auf die grosse Halbachse der Ellipse gemessen im Gegenuhrzeigersinn.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.TextOnPlane()

JsGraph3D.TextOnPlane( Text, x, y, Width )
JsGraph3D.TextOnPlane( Text, x, y, Mode )
JsGraph3D.TextOnPlane( Text, p, Width )
JsGraph3D.TextOnPlane( Text, p, Mode )

Text: String
x, y: Number
Position des Text-Referenzpunktes bezüglich der Plane
p: JsgVect2
Position des Text-Referenzpunktes bezüglich der Plane
Width: Number(>0); Optional
Begrenzende Breite für den Text bei TextRendering = 'html'
Mode: Integer; Optional; Default = 0
Gibt bei TextRendering = 'canvas' an, ob Text-Kontur und/oder Füllung gezeichnet werden sollen

Zeichnet einen Text in den aktuellen Text-Attributen. Die erste Aufrufvariante muss gewählt werden für TextRendering = 'html', die zweite für TextRendering = 'canvas'.

x und y bzw. p ist die horizontale bzw. vertikale Position des Text-Referenzpunktes auf der Plane. Die Position des Referenzpunktes relativ zur Textbox kann durch das Alignment festgelegt werden (siehe SetTextHAlign(), SetTextVAlign() und SetTextAttr()). Der Abstand des Referenzpunktes vom Text kann mit dem Text-Padding festgelegt werden (siehe SetTextPadding()), welches sich auch auf die Grösse der Textbox auswirkt (siehe GetTextBoxOnPlane()).

Die Text-Grafik wird nicht 3-dimensional gezeichnet, sondern immer 2-dimensional. Über eine Objekt-Transformation kann Canvas-Text jedoch verzerrt werden. Die Text-Grösse wird in Pixel angegeben, kann jedoch durch AutoScalePix oder eine Objekt-Transformation skaliert werden.

Der Text kann HTML Auszeichnungen enthalten, wenn TextRendering = 'html' ist. Der Text wird dann am Rand des Canvas umbrochen, auch wenn kein Width vorgegeben wird. Die Textbreite kann aber über Width auf eine selber vorgegebene Breite limitiert werden.

Die folgenden Mode Einstellungen gelten nur für TextRendering = 'canvas':

Mode Beschreibung
0 Text mit TextColor gefüllt zeichnen, keine Text-Kontur zeichnen
1 Nur Text-Kontur in der Farbe Color und der Strichdicke LineWidth zeichnen
2 Nur Text-Füllung in der BgColor zeichnen (auch Farbverläufe möglich)
3 Kombination von Mode 1 und 2

Wenn Mode = 3 gewählt ist, wird zuerst der Text gefüllt und danach die Kontur gezeichnet. Die Kontur liegt somit vor der Füllung. Wenn LineWidth zu dick gewählt wird, kann die Füllung von der Kontur vollständig verdeckt werden.

Hinweis: Wenn eine Objekt-Transformation definiert ist, wird die Kontur-Dicke mit dem Text transformiert. Die Strichdicke LineWidth gibt somit die Kontur-Dicke des untransformierten Textes wieder. Für ein Beispiel siehe JSG Test: AddTrans.

Über die Funktion GetTextBoxOnPlane() kann die Position und Grösse der den Text gerade umschliessenden Textbox abgefragt werden.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

JsGraph3D.GetTextBoxOnPlane()

JsGraph3D.GetTextBoxOnPlane( Text, x, y, Width )
JsGraph3D.GetTextBoxOnPlane( Text, p, Width )

Text: String
x, y: Number
Position des Text-Referenzpunktes bezüglich der Plane
p: JsgVect2
Position des Text-Referenzpunktes bezüglich der Plane
Width: Number(>0); Optional
Begrenzende Breite für den Text im mit SelectTrans() gewählten Koordinatensystem
Return WorkRect: JsgRect
Berechnete Textbox im mit SelectTrans() gewählten Koordinatensystem

Berechnet die Textbox eines Textes, der mit den aktuellen Text-Attributen gezeichnet würde.

Beim TextRendering = 'html' kann der Text HTML Auszeichnungen enthalten! Die Grösse des Textes wird berechnet, nachdem der Text intern gerendert worden ist, d.h. nachdem alle HTML Auszeichnungen interpretiert worden sind.

Die berechnete Textbox kann der Funktion RectWH() zum Zeichnen der umschliessenden Textbox übergeben werden, siehe JSG Test: Html Text und JSG Test: Canvas Text.

x und y bzw. p sind die horizontale bzw. vertikale Position des Text-Referenzpunktes auf der Plane. Die Position des Referenzpunktes relativ zur Textbox kann durch das Alignment festgelegt werden (siehe SetTextHAlign(), SetTextVAlign() und SetTextAttr()). Der Abstand des Box-Rahmens zum Text und damit des Referenzpunktes vom Text kann mit dem Text-Padding festgelegt werden (siehe SetTextPadding()).

Die Text-Grösse wird in den Properties w und h des WorkRect zurückgegeben. WorkRect ist ein internes Objekt zum Speichern von Rechteck-Daten.

Der Text wird bei TextRendering = 'html' am Rande des Canvas umgebrochen, auch wenn keine Width vorgegeben wird. Die Textbreite kann aber über Width auf eine selber vorgegebene Breite limitiert werden.

Bei TextRendering = 'canvas' wird Text nie umgebrochen, sondern geclippt. Width hat also keine Funktion und wird ignoriert.

Hinweis: Text, der im Mode TextRendering = 'canvas' gezeichnet wird, kann über eine Objekt-Transformation verzerrt werden. Diese Funktion gibt nur die Textbox des unverzerrten Textes zurück. Wird diese Box allerdings mit derselben Transformation gezeichnet, wird sie gleich verzerrt wie der Text.

JsGraph3D.MarkerOnPlane()

JsGraph3D.MarkerOnPlane( x, y, Mode, Mat )
JsGraph3D.MarkerOnPlane( p, Mode, Mat )
JsGraph3D.MarkerOnPlane( xArray, yArray, Mode, Mat, Size )
JsGraph3D.MarkerOnPlane( Poly, Mode, Mat )

Plane: JsgPlane
x, y: Number
Koordinaten bezüglich der Plane
p: JsgVect2
Koordinaten bezüglich der Plane
xArray, yArray: Array of Number
Arrays mit Koordinaten bezüglich der Plane
Size: Integer(>=0); Optional; Default = xArray.length
Poly: JsgPolygon
Poly enthält zu zeichnende Marker-Punkte
Mode: Integer(1..7); Optional; Default = 3
Bitmaske, die verschiedene Modi steuert
Mat: JsgMat2; Optional; Default = undefined
Matrix, mit welcher der Marker vor dem Zeichnen transformiert werden kann. Dies ist in der Regel eine Rotations-Matrix. Sie wird intern zum Zeichnen von Pfeilen mittels Marker verwendet. Die Matrix transformiert im Koordinatensystems des Canvas.
Mode Beschreibung
1 Markerkontur zeichnen
2 Marker füllen
4 Marker-Kontur invertieren, um Marker-Löcher in Flächen zu erhalten

Zeichnet und/oder füllt Marker in den aktuellen Marker-Attributen. Die Marker werden nicht perspektivisch verzerrt. Ihre Form und Grösse wird in Canvas Koordinaten angegeben.

Die zu verwendende Ebene kann mit SetPlane() definiert werden.

Weitere Infos zur Seite
Erzeugt Samstag, 19. Juli 2014
von wabis
Zum Seitenanfang
Geändert Samstag, 24. Februar 2018
von wabis