Differences

This shows you the differences between two versions of the page.

--- symbols-en [2019/11/09 21:32] – [Process route/block events] hermannk
+++ symbols-en [2024/03/13 14:32] (current) – [Themes] rjversluis
@@ Line 10: / Line 10: @@
 =====Themes directory structure=====
-| :!: In revision 14318 the SVG Themes are reorganised; Check the SVG paths. |
 {{ :rocview:themes-tree.png?0x400}}\\
 The official themes are located in the subdirectory **svg/themes**.\\
@@ Line 26: / Line 25: @@
 =====Setup=====
-{{:rocgui-ini-svg-en.png}}\\
+  * **Note:** With rev. 2.1.4068+ the dialog for a 6th theme did expand.
- \\
-==== Theme 1 - 5 ====
+| {{:rocgui-ini-svg-en.png}} |
+|  Rocview properties, Tab 'SVG' with open Properties dialog to **Theme 1**  |
+| **Attention:** For **RocWeb** and **andRoc** the SVG paths must be setted in the RocWeb dialog of the **[[rocrailini-rocweb-en#rocweb_settings|Rocrail properties]]**. |
+|< >|
+|  **if no suitable SVG file is found for an Object type, \\ the track plan shows an Error symbol at the position.**  |
+|  {{:symbols:errsym.png}}  |
+|  **SVG file not found**  |
+> **Note:**
+> Possible causes:
+> Further themes must be defined, e.g. **''User, Accessories''**.
+> The SVG number, Accessory option and/or Accessory number required for some Object types are not defined or are wrong defined.
+ \\
+==== Theme 1...6 ====
 Select the desired themes and __restart Rocview to activate__ them.\\
 If you have defined your own SVG symbol for a certain item, place it in the "Setup" list before the Theme that has the default symbol. \\ That means the first Theme determines how a SVG is portrayed.
@@ Line 49: / Line 64: @@
   * Windows = 10
   * Default = 10
+==== Adjust ====
+The field is to adjust the text pointsize from -100% to +100%. This could be of help in case multiple Rocviews, on different platforms/resolutions, are connected to the same Server. \\
+|< >|
+^ Example ^^
+|  {{:rocview:text-ps-mac-2560x1600.png?0x100}}  |  {{:rocview:text-ps-win-1920x1280.png?0x100}}  |  {{:rocview:text-ps-win-1920x1280-50.jpg?0x100}}  |
+|  Mac 2560x1600  |  Windows 1920x1280  |  Windows 1920x1280 -50%  |
 __The Rocview has to be restarted for changes to take affect.__\\
+==== Auto ID Width ====
+If this is set to 3 then the objects start with 100: e.g. sw100 \\
+If this is set to 0 or 1, the objects start without leading zeroes: e.g. sw1 \\
+==== Train connector ====
+The character used to connect the locomotive and train IDs.\\
+Default is an underscore character.\\
+Example with an equals character: (LocoID="V20_020", TrainID="HsDh")\\
+{{:rocview:block-trainconnector.jpg}}\\
+==== Black replacement ====
+Replace 'on the fly' all ''stroke="rgb(0,0,0)"'' with the selected color.\\
+Could be of use in case the panel background is a dark color.\\
+ \\
+=====Options=====
 ==== Process route/block events ====
 To reduce processor resources these options can be disabled.\\
@@ Line 63: / Line 104: @@
 Only the SpDrS60 theme has the needed SVGs.\\
 {{:rocview:sw-routes.png}}\\
-To get the route IDs automatically set in the switch objects the analyzer must be started again if the routes were generated with a revision older then 7884.\\
+To get the route IDs automatically set in the switch objects the router must be started again if the routes were generated with a revision older then 7884.\\
 In case of manual routes use the __**[[:select-en|Select dialog]]**__.\\
-====Route prio====
+====Route priority====
 Overwrites block occupancy in case a route is reserved.\\
- \\
-=====Examples=====
+====Short ID====
+Show the loco [[:loc-gen-en#use_short_id|Short ID]] in the block instead of the ID.\\
+ \\
-====Track/Road Layout====
+=====Track/Road Layout=====
 Track and road symbols can be mixed in one layout:\\
 {{:track-road-layout.png}}\\
@@ Line 89: / Line 132: @@
 The file names are predetermined for each state of a symbol as listed here: [[symbolnames-en|Symbol Names]]\\
  \\
-The path must be conform:\\
+Note: all file names __must not__ contain capital letters
-http://www.w3.org/TR/SVG11/paths.html#PathData\\
  \\
-But only **M**, **L**, **C** and **z** are evaluated. All coordinates are rounded to integers.\\
+==== Insert self created symbols into the track plan ====
-The **C**urve is defined in the "w3" document but not supported in Rocview and **Inkscape**. Its have never been used in the Themes.
+:!: Self created SVG symbols are __NOT__ displayed in the **[[rocgui-menu-en#add_item|Add item]]** dialog. \\ To insert these symbols into the track plan, a standard symbol of the desired object type must be selected. The number of the own symbol must be set in the properties dialog of the object in the fields **[[output-gen-en#svg|SVG]]**, **[[tracks-gen-en#number|Number]]** or **[[sensor-gen-en#accessory|Accessory#]]**. In object types with the option **Accessory** can be specify that the symbol from the //accessory// theme should be used.
+=====Supported SVG Elements=====
+====Path====
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/path
+Only **M**, **L**, **C** and **z** are evaluated. All coordinates are rounded to integers.\\
 The following example (track with blue outline filled yellow ) shows which information is basically evaluated by Rocview:
 <code xml>
 <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
@@ Line 105: / Line 150: @@
 </code>
-The path node maybe multiple listed.\\
+====Circle====
-Rotation is done in the Rocview.\\
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/circle
- \\
-Curves and circles:\\
 <code xml>
 <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
@@ Line 117: / Line 159: @@
 </svg>
 </code>
+**Note:** //If the radius is zero this SVG element will be skipped.//\\
-**Note:** To create curves it's recommended to use **<circle .../>** and partly cover with another elements. Alternativ it's possible to use multiple short strokes or points.
+====Ellipse====
- \\
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/ellipse
-==== SVG viewer and editor ====
-The Online tool **[[https://www.rapidtables.com/web/tools/svg-viewer-editor.html|SVG-Viewer/Editor]]** can be useful to view SVG, create and edit. \\
-It's not so powerful as Inkscape, but it's much easier to use than Inkscape or others.
-  * ** Note: ** \\ Unfortunately the tool does not check the XML conformity. SVG files edited with the tool should be e.g. be checked with a browser on it.
-To become familiar with the tool, is recommend to open an SVG file from a Rocrail theme. \\
-Changes to the code elements make it very easy to see the effects on the Symbol representation. \\
-Alternatively, code sections on this wiki page are also suitable if they are transferred to the tool via // Copy & Paste //. \\
-\\
-Since the tool's "New" function does not create a frame that matches Rocrail's symbols, the following frame should first be copied to the tool's Code window to create new symbols:
 <code xml>
-<svg width="32" height="32">
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
   <g>
-    <!-- Insert the SVG elements here -->
+    <ellipse cx="16" cy="12" rx="8" ry="4" fill="red" stroke="blue"/>
   </g>
 </svg>
 </code>
-Alternatively, a new SVG file can of course also be created by modifying an existing file. \\
+**Note:** //If the radius rx or ry is zero this SVG element will be skipped.//\\
-|< >|
-^  Funktions  ^
-| {{:wiki:svg-viewer-new.png?25}} New |
-| {{:wiki:svg-viewer-open.png?25}} Open SVG file |
-| {{:wiki:svg-viewer-view.png?25}} View SVG code |
-| {{:wiki:svg-viewer-save.png?25}} Save SVG file |
- \\
-==== Inkscape ====
-You can use Inkscape http://www.inkscape.org/ and start to create a new 32x32 icon.
-Rocrail supports just integers for coordinated and therefore the following settings are quite useful:
-{{:inkscape_config1-en.png}}{{:inkscape_config2-en.png}}{{:inkscape_config3-en.png}}
-These settings , especially 'Always snap', apply only during the creation of a path (Shift+F6) . As soon as you try to move path nodes with the mouse Inkscape will create decimal coordinates again.
-Another useful setting is to switch on the the outline display:
+====Polygon====
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/polygon
+<code xml>
+<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>
+</code>
-{{:inkscape_config4-en.png}}
+====Rectangle====
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/rect
+<code xml>
+<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>
+</code>
+Setting **rx > 0** will draw a rounded rectangle.\\
-At the moment the only thing evaluated in Rocrail are <path../>.\\
+====Line====
-With Shift+F6 you can start this sequence; try to generate Lines only, no Curves.\\
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/line
-As soon as you're done with the graphics save the file in Inkscape and open it with a text editor to copy the path information into another new file.\\
+<code xml>
+<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" stroke-width="8"/>
+  </g>
+</svg>
+</code>
+  * **Note:** For the **''line''**-Element the in the [[https://www.w3.org/TR/svg-strokes/#LineCaps|www.w3.org specifikation]] defined attribut **''stroke-linecap''** will be __not supported__. \\ Rocview draw the caps of the **''line''**-Element allways **round**. **((for this is minimal **''stroke-width="3"''** necessary))**
+====PolyLine====
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Element/polyline
+<code xml>
+<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>
+</code>
+ \\
-=====Default Symbols=====
-Default symbols are SVG like vector graphics, and are hardcoded in the Rocgui sources.\\
-They only are needed when the Rocrail installation is broken, and there are only some basic symbols available! Report it if you are having trouble with symbols.\\
- \\
-=====Blinking Aspects=====
+=====Alternative <g>=====
-Starting with revision 5315 a second Graphics Container((<g></g> Section)) can be added in the SVG definition which will be alternated every second.\\
+A second Graphics Container((<g></g> Section)) can be added in the SVG definition which will be alternated every second.\\
-Only signal objects are enabled for this feature.\\
+**Note:** //Rocweb cannot support multiple <g> containers, and will show all overlapped.//\\
 ====Example====
@@ Line 184: / Line 236: @@
  \\
+=====Preview=====
+{{ :symbols:svg-preview-de.png?240}}
+====Windows====
+This extension can be used to preview SVG symbols in the file explorer:
+  * __[[https://github.com/tibold/svg-explorer-extension/releases|SVG Viewer Extension for Windows Explorer]]__
+====Ubuntu====
+Ubuntu shows SVG previews out of the box.\\
+====macOS====
+{{ :symbols:macos-svg-preview.png?240}}
+The Finder shows only strict formatted SVGs.\\
+Starting with revision 2.1.381, the following SVG header format is also supported by Rocview and will enable preview in the macOS Finder:
+<code xml>
+<svg width="100%" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
+  ...
+</svg>
+</code>
+For information on the viewBox attribute see:
+  * https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/viewBox
+The former width/height are now part of the viewBox: "x y width height". (Rocview only evaluates the width and height values of the viewBox.)\\
+The width attribute is set to 100% to enable (pre)viewers to scale up to the available space. (Rocview do not evaluate this value.)\\
+If the following option is manually set in the rocview.ini, the conversion will be done automatically:
+<code xml>
+<gui convertsvg="true" ... >
+  ...
+</gui>
+</code>
+ \\