User Tools

Site Tools


symbols-de

SVG-Symbole und Themen-Einstellungen

Themen-Verzeichnis-Struktur

Die offiziellen Themen befinden sich im Unter-Verzeichnis svg/themes.
Alle anderen Unter-Verzeichnisse sind benutzerdefinierte Themen.


Das offizielle SpDrS60-Thema

Das ofizielle Thema ist SpDrS60.
Für Tests und Problemmeldungen sollte dieses Thema verwendet werden.
Alle anderen Themen müssen der Namens-, Verbindungs- und Größen-Konvention des SpDrS60-Themas entsprechen.


Einstellungen

Rocview-Egenschaften, Registerkarte 'SVG' mit geöffnetem Eigenschafts-Dialog zu Thema 1


Thema 1 - 5

Einstellen des Pfades zum Verzeichnis des gewünschten Themas. Erforderlich ist ein Neustart von Rocview um es zu aktivieren.
Sollen eigene definierte SVG-Symbole verwendet werden, muss der entsprechende Pfad zu diesen Symbolen als erster in die Themenliste gesetzt werden.
Bei nachfolgend angegebenen Themen werden bereits geladene SVG-Symbole übersprungen.
Das bedeutet, dass jeweils das erste Thema bestimmt, wie ein SVG-Symbol aussieht.

Dreipunkt-Schaltfläche [ . . . ]

Öffnet die Explorer-Sicht zur Auswahl des gewünschten Verzeichnisses für das Thema.

Eigenschaften

Die Schaltfläche öffnet den Dialog Themen-Eigenschaften zum ersten SVG-Thema.

Schriftgröße für Objekt-Kennungen

Stellt die Schriftgröße der Kennung am Objekt-Symbol im Gleisplan ein. Bereich 2 bis 15. Voreingestellt ist 7.
Rocview muss neugestartet werden, damit Änderungen aktiviert werden.

Farbe...

Im Standarddialog kann die Schrift-Farbe der Objekt-Kennung eingestellt werden. Schwarz ist voreingestellt.

Schriftgröße für Text-Objekte

Stellt die Schriftgröße für Block-Kennungen und für Text-Objekte mit Schriftgröße 0 ein.
Beste Ergebnisse für: 1)

  • OS X = 14
  • Linux = 13
  • Windows = 10
  • Default = 10

Rocview muss neugestartet werden, damit Änderungen aktiviert werden.

Zeige Fahrstraßen-/Block-Ausleuchtung

Auf Systemen mit geringer Grafik- und/oder Hauptprozessorleistung können die folgenden Optionen deaktiviert werden, um die Beanspruchung der Resourcen zu reduzieren:

  • Zeige Fahrstraßen-Ausleuchtung
    Wird diese Option deaktiviert, so wird die (gelbe) Fahrstraßen-Ausleuchtung in Gleisplan-Symbolen nicht angezeigt
  • Zeige Belegt-Ausleuchtung
    Wird diese Option deaktiviert, so wird die (rote) Belegt-Ausleuchtung in Gleisplan-Symbolen nicht angezeigt.

Es gibt mehrere Parameter, die die Ausleuchtung der Gleis-Elemente bestimmen.

Zeige Fahrstraßen bei Weichen

Bei aktivierter Option werden die normalen Weichen-Positionen in Cyan (Türkis).2) angezeigt.
Für reservierte Fahrstraßen wechselt diese Farbe in Gelb.
Weichen-Typen mit der Option "Raster" werden von dieser Option nicht unterstützt.
Nur das SpDrS60-Thema enthält die erforderlichen SVGs.

Wenn die Fahrstraßen mit einer Revision älter als 7884 erzeugt wurden, muss der Router erneut gestartet werden,
damit die Fahrstraßen-Kennungen automatisch in die Weichen-Objekte eingetragen werden.
Im Fall manuell angelegter Fahrstraßen den Auswahl-Dialog verwenden.

Fahrstraße priorisieren

Überschreibt die Blockbelegung, falls eine Fahrstraße reserviert ist.

Gleis-/Straßen-Plan

Gleis- u. Straßen-Symbole können in einem Plan gemischt werden:

Die Straßen-Symbole haben dieselbe Benennung wie die Gleis-Symbole, aber ein road- vorangestellt.


Erzeugen eigener SVG-Symbole

Text-Editor

Wenn eigene Symbole für Gleisplan-Objekte verwendet werden sollen, dann müssen diese im SVG-Format erstellt werden.
Die Attribute width und hight in der SVG-Datei werden verwendet, um die Größe des Symbols im Gleisplan zu berechnen.
Es muss allerdings sichergestellt sein, dass diese Werte ein Vielfaches von 32 darstellen.

Für Drehscheiben können aufgrund ihrer Komplexität keine eigenen Symbole definiert werden.

Die Dateinamen für die einzelnen Symbole mit den jeweiligen Zuständen sind vordefiniert. Siehe: Symbol-Namen

Unterstützte SVG-Elemente

Pfad (path)

Nur M, L, C und z werden ausgewertet. Alle Koordinaten werden zu Ganzzahlen gerundet.

Attribute und Befehle im <path-Element

BefehlNameBeschreibung
M x,ymovetoBewegt den Zeichenstift auf die angegebene Koordinate.
L x,ylineZeichnet eine Linie von der aktuellen zur angegebenen Koordinate.
zclosepathSchließt den Zeichenvorgang des aktuellen <path> ab.

Die Attribute stroke und stroke-width definieren die Farbe und Stärke der gezeichneten "Linien"; optional bestimmt fill die Füll-Farbe einer mit den Parametern des d-Attributs umschlossenen Fläche.
Farben können anstelle von z.B. stroke="blue" auch mit der RGB-Funktion stroke="rgb(0,0,255)" definiert werden.
Damit sind beliebige Mischfarben aus dem 32bit-Farbraum möglich, soweit es die PC-Grafik-Hardware unterstützt.
Die Befehle mit ihren Koordinaten werden im d-Attribut (draw = zeichnen) definiert, dass immner mit dem M-Befehl beginnt und mit dem z-Befehl endet.

Beispiel

Das folgende Beispiel (Gleis mit blauer Umrandung und gelber Füllung) zeigt, welche Informationen einer SVG-Datei durch Rocview ausgewertet werden:

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
  <g>
    <path stroke="blue" stroke-width="1" fill="yellow" d="M 0,16 L 2,13 L 29,13 L 31,15 L 31,16 L 29,18 L 2,18 L 0,16 z " />
  </g>
</svg>


Kreis (circle)

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
  <g>
    <circle cx="16" cy="12" r="5" fill="red" stroke="blue"/>
  </g>
</svg>


Ellipse

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
  <g>
    <ellipse cx="16" cy="12" rx="8" ry="4" fill="red" stroke="blue"/>
  </g>
</svg>


Vieleck (polygon)

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <polygon points="0,0 31,0 31,31 0,31" fill="red" stroke="blue"/>
  </g>
</svg>


Rechteck (rect)

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <rect x="2" y="2" rx="5" width="20" height="20" stroke="blue" fill="red"/>
  </g>
</svg>

Einstellung rx > 0 zeichnet ein abgerundetes Rechteck.

Line (line)

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <line x1="0" y1="0" x2="31" y2="31" stroke="black"/>
  </g>
</svg>


Mehrfachline (polyline)

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <polyline points="0,31 15,8 15,24 31,0" stroke="blue"/>
  </g>
</svg>


Alternative SVG durch zweiten <g>-Container

In der SVG-Definition kann ein zweiter Graphik-Container (<g>-Knoten) hinzugefügt werden.
Die Elemente der beiden Container werden im Sekunden-Rhythmus abwechselnd angezeigt = "Blinken".

  • Hinweis: Im Gleisplan ist diese Funktion nur aktiv, wenn
    1. dem Objekt eine SVG-Datei mit zweitem <g>-Container zugeordnet ist.
    2. im Kontext-Menü des Objekts die Option "Alternative SVG aktivieren" gesetzt ist.

Beispiel

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
  <g>
    <path stroke="blue" fill="yellow" d="M 0,16 L 2,13 L 29,13 L 31,15 L 31,16 L 29,18 L 2,18 L 0,16 z " />
  </g>
  <g>
    <path stroke="blue" fill="grey" d="M 0,16 L 2,13 L 29,13 L 31,15 L 31,16 L 29,18 L 2,18 L 0,16 z " />
  </g>
</svg>


Vorschau

Windows

Diese Erweiterung kann zur Vorschau von SVG-Symbolen im Datei-Explorer verwendet werden:

Ubuntu

Ubuntu zeigt SVG-Vorschau ohne weiteres Zutun.

macOS

Der Finder zeigt nur streng formatierte SVGs.
Beginnend mit Revision 2.1.381, wird auch das folgende SVG-Header-Format durch Rocview unterstützt and aktiviert die Vorschau im macOS-Finder:

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

Für Information zum viewBox-Attribut siehe:

Die bisherige Breite / Höhe ist jetzt Teil der viewBox: "x y width height". (Rocview wertet nur die Werte für Breite und Höhe der viewBox aus.)
Das width-Attribut ist auf 100% gesetzt, damit Vorschauen auf den verfügbaren Platz skaliert werden können.(Rocview wertet diesen Wert nicht aus.)

Wenn die folgende Option in der rocview.ini manuell eingestellt ist, wird die Konvertierung automatisch durchgeführt:

<gui convertsvg="true" ... >
  ...
</gui>


Externe Hilfsmittel für SVG-Dateien

Online-SVG-Viewer/Editor

Das Online-Tool SVG-Viewer/Editor kann hilfreich sein, um SVG-Symbole anzuzeigen, zu erstellen und zu bearbeiten.
Es ist nicht so mächtig wie Inkscape, aber es ist viel einfacher zu verwenden, als Inkscape oder andere.

  • Hinweis:
    Leider prüft das Tool nicht die XML-Konformität. Mit dem Tool bearbeitete SVG-Dateien sollten z.B. mit einem Browser darauf geprüft werden.

Um mit dem Tool vertraut zu werden, empfiehlt sich das Öffnen einer SVG-Datei aus einem Rocrail-Thema.
Damit können durch Änderungen an den Code-Elementen sehr gut die Auswirkungen auf die Symbol-Darstellung verfolgt werden.
Alternativ sind auch Code-Abschnitte auf dieser Wiki-Seite geeignet, wenn sie per Copy & Paste in das Tool übertragen werden.

Da die "Neu"-Funktion des Tools keinen für Rocrail-Symbole passenden Rahmen erzeugt,
sollte zur Erstellung neuer Symbole zuerst folgender Rahmen in das Code-Fenster des Tools kopiert werden:

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
    <!-- Hier die SVG-Elemente einfügen -->
  </g>
</svg>

Alternativ kann eine neue SVG-Datei natürlich auch durch Änderungen einer vorhandenen Datei erzeugt werden.

Funktionen
Neu
SVG-Datei öffnen
SVG-Code darstellen
SVG-Datei speichern


Inkscape

Inkscape (http://www.inkscape.org/) ist ein sehr mächtiges Tool zur Erstellung und Bearbeitung von SVG-Dateien. Da Rocrail nur ganzzahlige Koordinaten verwendet, sollten folgende Einstellungen in Inkscape erfolgen:

Dabei ist zu beachten, dass insbesondere die Option 'Immer einrasten' nur beim Zeichnen der Pfade (Shift+F6) wirkt. Sobald Knoten mit der Maus verschoben werden, generiert InkScape Koordinaten mit Nachkommastellen.

Eine weitere sinnvolle Einstellung ist das Anzeigen des Umrisses:



Nach Fertigstellung muss die Grafik als SVG-Datei gespeichert werden.

:!: Diese in Inkscape gespeicherte Datei kann Rocview nicht direkt verwenden. Sie muss erst noch bearbeitet werden:

Mit einem Texteditor (notepad++) werden nur die Zeilen herauskopiert, die mit den unterstützten SVG-Elementen beginnen:

  • <path …, <circle …, <ellipse …, <polygon …, <line … und <polyline …

Diese Zeilen müssen noch in die <svg>- u. <g>-Knoten eingefügt werden:

<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
  <g>
 
    <!-- Hier nur die Zeilen mit den unterstützten SVG-Elementen einfügen -->
 
  </g>
</svg>

Der gesamte <svg>-Abschnitt muss als SVG-Datei den Konventionen für die Namensgebung entsprechend gespeichert werden.
Die Datei wird in ein Themen-Verzeichnis kopiert und ist in Rocview als Objekt-Symbol in Gleisplänen zu verwenden.

:!: Ein Forums-Beitrag u.a. zu Erfahrungen mit Inkscape: https://forum.rocrail.net/viewtopic.php?p=25518#25518


Videos

Die folgenden Videos zeigen die Grundlagen zur Erstellung von SVG-Symbolen mit einem Text-Editor:

i.ytimg.com_vi_cwd8qqzps3u_0.jpg i.ytimg.com_vi_vmyiid73mqq_0.jpg i.ytimg.com_vi_j-d26ejvxlw_0.jpg

Klick auf die Bilder öffnet die Videos in YouTube.

1)
Abhängig von Bildschirm-Auflösung und pers. Geschmack.
2)
Cyan=rgb(0,255,255)
symbols-de.txt · Last modified: 2020/05/17 03:24 by rainerk