User Tools

Site Tools


svg:dynthemes-de

SVG-Dynamische-Themen

InhaltRocview SVG-Themen


Diese Dokumentation basiert auf der Rocrail-Version 2.1.4966 vom 03.08.2024.
Update: Rocrail Version 2.1.5225 M4 vom 08.11.2024
Update: Rocrail Version 2.1.5254 M4 vom 17.11.2024 .
Die Entwiklung ist noch "In Arbeit" (WIP).

Einführung

SVG-Symbole (Scalable Vector Graphics) werden verwendet, um Rocrail-Objektsymbole zu definieren und den Inhalt einer Rocrail-Plandatei anzuzeigen.
SVG-Symbole können mit dem internen Rocview-SVG-Editor von Rocview erzeugt und/oder geändert werden.

Liste der Rocrail-Clients, die themes und/oder dynthemes nutzen:

Rocrail Client Plattform themes dynthemes
Rocview Computer ja ja
RocWeb Web-Browser ja nein
andRoc Android ja nein
RocControl iOS/iPadOS/macOS nein ja


Pfad

Die Pfade zu den SVG-Symbolen sind:

Path Description
svg/themes Standard default SVG themes.
svg/dynthemes Dynamic optional SVG themes.
svg/userthemes optional SVG themes für Benutzer-Symbole.
svg/… optional SVG themes.


Themen Konfiguration

Rocview

Die SVG-Konfiguration für Rocview erfolgt unter „Rocview-Eigenschaften / SVG“.

Thema Pfad Lade-Option aktiv
Thema 1 /vollständigerpfad/svg/dynthemes/mysvg ja / nein
Thema 2 /vollständigerpfad/svg/dynthemes/SpDrS60 ja / nein
Thema 3 /vollständigerpfad/svg/dynthemes/Accessories ja / nein
Thema 4 /vollständigerpfad/svg/dynthemes/Roads ja / nein
Thema 5 . ja / nein
Thema 6 . ja / nein

Es werden nur Themen mit aktiver Lade-Option=ja verwendet.
Die Reihenfolge beim Laden der Symbole erfolgt von oben nach unten (Thema 1 bis Thema 6).
Bereits geladene Symbole werden nicht überschrieben.
Dabei ersetzen die zuerst aufgeführten eigenen Symbole die Standardsymbole.

RocControl

Die SVG-Konfiguration für RocControl erfolgt in „Rocrail-Eigenschaften / SVG“.

Theme Path
Thema 1 /vollständigerpfad/svg/dynthemes/mysvg
Thema 2 /vollständigerpfad/svg/dynthemes/SpDrS60
Thema 3 /vollständigerpfad/svg/dynthemes/Accessories
Thema 4 /vollständigerpfad/svg/dynthemes/Roads
Thema 5 .
Thema 6 .

Die Reihenfolge beim Laden der Symbole erfolgt von oben nach unten (Thema 1 bis Thema 6).
Bereits geladene Symbole werden nicht überschrieben.
Dabei ersetzen die zuerst aufgeführten eigenen Symbole die Standardsymbole.
- siehe https://wiki.rocrail.net/doku.php?id=rocctrl:rocctrl-de
Zusätzlich:
- Der Pfad muss für den Rocrail-Server zugänglich sein.
- RocControl identifiziert die Symbole anhand des „name“-Attributs des SVG-Symbols (nicht anhand des Dateinamens).
- Rocrail bietet ein standardmäßiges integriertes SVG Thema für RocControl, wenn in der SVG-Liste keines festgelegt ist.
- Benutzerdefinierte SVGs müssen vom Typ Dynamic sein und der Pfad muss „dynthemes“ enthalten.

Konstruktionsdetails

Unterstützte Elemente

Ein „SVG-Tutorial“ findet sich unter https://www.w3schools.com/graphics/svg_intro.asp
Ein SVG-Symbolcode kann jedes beliebige SVG-Element verwenden, aber … .
- das Standard-SVG-Symbol misst 32 x 32 Pixel;
- daher kann ein Kreis mit seinem Radiuswert nicht innerhalb dieses Symbols zentriert werden, da für alle Koordinaten ganzzahlige Werte verwendet werden müssen;
- …

Element Bedeutung
svg Kopf
g Gruppe; mindestens ein g muss enthalten sein
path einfache oder komplexe Formen erstellen
rect ein Rechteck erstellen
circle einen Kreis erstellen
ellipse eine Ellipse erstellen
line eine Linie erstellen
polygon eine Grafik mit mindestens drei Seiten erstellen
polyline ein Form nur aus geraden Linien erstellen

Das bevorzugte Element fürs Zeichnen ist <path>.

Kopfzeilen-Attribute

Beispiele:
- theme SVG Symbol Kopf:

  <svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
 ... </svg>

- dyntheme SVG Symbol Kopf:

  <svg name="hl_signalaspect" ledsupport="true" width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
 ... </svg>

Der Kopf eines SVG-Symbols kann die folgenden Attribute enthalten:

Element Attribut benötigt Beispiel Bedeutung
svg - ja - kein LED-Attribute und kein G-STATE wid für dieses Symbol verwendet
name dynthemes name="hl_signalaspect" der Name des Symbols, das auf Clients identifiziert werden soll
ledsupport dynthemes ledsupport="true" Rocrail-spezifisch; Für dieses Symbol werden LED-Attribute verwendet;
bei Weichen wird auch G-STATE für dieses Symbol verwendet
width ja width="100%" die Größe des Symbols; ein fester Wert von 100 %
viewBox ja viewBox="0 0 32 32" ie ViewBox des Symbols; beginnend bei 0 0;
Breite und Höhe müssen ein Vielfaches von 32 sein; max= 128;
xmlns ja xmlns="http://www.w3.org/2000/svg" in Link zum Namespace; ein fester Wert von "http://www.w3.org/2000/svg"

SVG Element Attribute

SVG Element G

Beispiele:

  <g state="straight"> ... </g>
  <g state="turnout"> ... </g>
  <g state="left"> ... </g>
  <g state="right"> ... </g>
Element Attribut Beispiel Bedeutung
g - <g> normal, keine Attribute
state state="straight" Rocrail-spezifische-Steuerung, um diese Gruppe bei dem gegebenen Status auszuführen
state state="green,yellow,1,2" Der Statuswert kann eine durch Kommas getrennte Liste (CSV) sein;
Dieser Zustand verwaltet den grünen und gelben Zustand sowie die Aspekte 1 und 2 eines Signals, abhängig vom verwendeten Adressierungsschema.

SVG Element PATH

Beispiele:

<path led="1" stroke="rgb(192,192,192)" fill="rgb(192,192,192)" d="M 8,14 L 23,14 L 23,17 L 8,17 z "/>
<path led="2" stroke="black" fill="rgb(255,0,0)" d="M 2,6 L 6,2 L 27,2 L 23,6 L 27,10 L 6,10 z "/>
<path led="3" alt="true" stroke="none" fill="rgb(000,255,000)" d="M 04,02 L 07,02 L 07,05 L 04,05 z " />
Element Attribut Beispiel Bedeutung
path led led="1" Rocrail-spezifische-Steuerung, um STROKE und FILL einzufärben
alt alt="true" this element should use blinking; see hint below
stroke stroke="black" legt die Farbe der Linie um ein Element fest;
verwendet die implizite STROKE-WIDTH von 1
fill fill="rgb(192,192,192)" legt die Farbe des Inneren eines Elements fest
d d="M 8,14 L 23,14 L 23,17 L 8,17 z " eine Reihe von Befehlen, die den Pfad definieren;
M = moveto; L = lineto; Z = close path; … mit komma-separierten x,y-Punkten;
x und y müssen Integer-Werte sein

Hinweis: Zum Blinken verwenden Sie das Kontextmenü des Objekts im Rocrail-Plan und aktivieren „Alternative SVG aktivieren“.

SVG Element RECT

Beispiele:

<rect txt="1" x="0" y="0" rx="0" width="31" height="10" stroke="none" fill="none"/>
<rect x="0" y="0" rx="0" width="1" height="1" stroke="rgb(0,0,255)" fill="rgb(0,0,255)"/>
Element Attribute Beispiele Bedeutung
rect led led="1" Rocrail-spezifische-Steuerung, um STROKE und FILL einzufärben
txt txt="1" Rocrail-spezifisch; um die Positionierung der Symbol-Kennungs-Zeichenkette zu bestimmen;
funktioniert nur mit RECT;
x x="0" die x-Position der oberen linken Ecke des Rechtecks
y y="0" die y-Position der oberen linken Ecke des Rechtecks
rx rx="0" das rx-Attribut definiert den Radius der Ecken des Rechtecks
ry ry="0" das ry-Attribut definiert den Radius der Ecken des Rechtecks
stroke stroke="black" bestimmt die Farbe der Linie um das Element;
verwendet die implizite STROKE-WIDTH von 1
fill fill="rgb(192,192,192)" bestimmt die Farbe innerhalb des Elements

LED-Attribut-Werte

Die normalen LED-Attributwerte liegen im Bereich von 1 bis 99.
Durch Offsets zum Normalwert lässt sich die Bedeutung erweitern:

LED Offset Bedeutung Bemerkung
- - die Farben innerhalb des SVG-Symbols werden angezeigt
led="x" +0 die Füll-Farbe wird auf die aktuwelle Status-Farbe gesetzt
led="x" +100 die STROKE-Farbe wird auf die aktuwelle Status-Farbe gesetzt
led="x" +200 die STROKE-Farbe wird auf die Schwarz-Farbe gesetzt
led="x" +300 der STROKE erhält die Status-Farbe und FILL wird auf "nonbe" gesetzt (transparent) Kann für Test des Text-Rahmens verwendet werden.
led="x" +400 die FILL-Farbe wird vom Attribut fillon und filloff verwendet. (Eigene Farbe unabhängig von den Themen-Eigenschaften.) Für Typ Ausgang.

Die folgenden LED-Attributwerte sind definiert:

Name Wert SVG-Ausleuchtungs-Eigenschaften
Gleis (auch das Gleis von einem Rückmelder oder einem Signal)
occ 1 Free, Occupied, Reserved, Shunt
Block
occ 1 FILL Free, Occupied, Reserved, Enter, Closed, Ghost, Short circuit, Accept ident
siehe auch Wie der Block-Status dargestellt wird
https://wiki.rocrail.net/doku.php?id=block-de#wie_der_block-status_dargestellt_wird
occ 1 STROKE Shunt (färbt den Rahmen des Blocksymbols ein)
blockstate 2 Blockstatus-Farben siehe Status-Signal
https://wiki.rocrail.net/doku.php?id=block-signals-de#status-signal
sensplus 3 Input off, Input on
sensmin 4 Input off, Input on
arrowplus 5 STROKE / FILL bestimmen die Farbe
arrowmin 6 STROKE / FILL bestimmen die Farbe
Taster, Ausgang
stateoff 2 Output off
stateon 3 Output on
Rückmelder
stateoff 2 Input off
stateon 3 Input on
Signal
red 2 Rot
green 3 Grün
yellow 4 Gelb
white 5 Weiss
blank 6 Blank
Multi-Aspect-Signal
Aspekt Nr. 00…31 STROKE / FILL bestimmen die Farbe des Aspekts
Rückmelder-Register
stateoff, stateon 2..9 für Rückmelder 1..8 Input off, Input on
Doppelte-Kreuzzungs-Weiche
markers above 6 STROKE / FILL bestimmen die Farbe
markers below 7 STROKE / FILL bestimmen die Farbe

Sollte ein bestimmtes Licht aus sein, wird die Farbe für „blank“ angezeigt.

SVG-Ausleuchtungs-Eigenschaften

Jeder SVG-Themenordner enthält die Datei „properties.xml“, die die Beleuchtungseigenschaften für dieses SVG-Thema enthält. Der Inhalt kann unter Rocview Properties / SVG / Theme X / Properties
bearbeitet werden. Ein Beispiel ist unten dargestellt:

Die Hauptverwendung ist:

Farbe Hauptverwendung
Free, Occupied, Reserved, Shunt Gleis, Block
Enter, Closed, Ghost, Short circuit, Accept ident Block
Automatic, Half automatic, No destination Status
Output on, Output off Taster, Ausgang
Input on, Input off Rückmelder
Red, Green, Yellow, White, Blank Signale
Slip Weichen


SVG Berechnung zur Laufzeit

Berechnen der Farbe:

Eine Lokomotive beginnt mit der Fahrt auf einer Strecke, zu der dieses Gleis gehört. Die Farbe des Gleises sollte sich also von Weiß („Frei“) nach Gelb („Reserviert“) ändern.

Der Code des SVG-Symbols mit dem Attribut led=„101“ definiert den geometrischen Teil des Symbols, der die Farbe ändern muss.

Die RGB-Werte der Zustandsfarben werden in den „Beleuchtungseigenschaften“ des Hauptthemas definiert.

Berechnung des visuellen Erscheinungsbildes:

Dabei benötigt jeder Status ein eigenes Erscheinungsbild.

state="straight" sowie state="turnout" beschreiben das Symbol vollständig.

Der gemeinsame Platzhalter für die Objekt-ID ist der einzige gemeinsame Teil und wird daher in state="all" platziert.

Symbol Liste

Für einige dynamische SVG-Themen-Symbole sind unten detaillierte Beispiele aufgeführt:

Symbol Datei Objekt
straight.svg Gleis
sensor-off.svg Rückmelder
accessory-6-off.svg Rückmelder Register
button-0-off.svg Taster
turnoutleft.svg Weiche
signalmain-r.svg Signal
hl_signalaspect-0.svg Multi-Aspekt-Signal
block.svg Block
block-state-min.svg Block mit Status-Signal
blockstate.svg Status-Signal


Test Arbeitsbereich

Hier geht es zum SVG Dynamic Themes Test

svg/dynthemes-de.txt · Last modified: 2024/11/25 21:35 by hermannk