Page History
...
For more information see also the Inkscape FAQ for this topic: http://wiki.inkscape.org/wiki/index.php/Frequently_asked_questions#What_about_flowed_text.3F
Text Colors
Sadly the Batik SVG Renderer that is used in KIELER does not handle text colors as well as Inkscape does. When setting the fill color directly on a text element in Inkscape, it will not be displayed in the Simulation Visualization View. The text will be black.
However there is a simple workaround: Select the text objects that should be colored, group them (Ctrl + G), then set the fill color on this group. The child elements will inherit the color and (for whatever reason) this does also work in Batik.
Creating a Configuration File
...
It is used to change the appearance of elements. The fill color, stroke color and with as well as opacity can be changed.
Attribute | Domain | Description |
---|---|---|
fillColor | String, either a color name of predefined colors, or a hexadecimal rgb color | Sets the fill color |
fillOpacity | Float, ranges from 0 (fully transparent) to 1 (fully visible) | Sets the opacity of the filling |
strokeColor | Same as fillColor | Sets the color of the outline / stroke |
strokeOpacity | Same as fillOpacity | Sets the opacity of the outline / stroke |
opacity | Same as fillOpacity | Sets the overall transparency |
Text Animation
This animation can be used for text objects in the SVG to set the font and text.
Attribute | Domain | Description |
---|---|---|
text | String | Sets the text of the element |
fontSize | Integer | Sets the size of the text element |
fontFamily | String, name of an installed font (e.g. "Arial Black" or "serif") | Sets the font family |
Move Animation
This animation changes the position of an SVG element relative to its original position.
Attribute | Domain | Description |
---|---|---|
x | Float | The x coordinate relative to the original position |
y | Float | The y coordinate relative to the original position |
Rotate Animation
This animation changes the rotation of elements.
Attribute | Domain | Description |
---|---|---|
angle | Integer | The angle in degrees that the object should be rotated |
anchorX | Float, 0 to 1 | Relative position inside the SVG element where the anchor point of the rotation will be. 0 is at the left side, 1 is at the right side. Default is 0.5, which is the middle. |
anchorY | Float, 0 to 1 | Relative position inside the SVG element where the anchor point of the rotation will be. 0 is at the top side, 1 is at the bottom side. Default is 0.5, which is the middle. |
Walk Path Animation
This animation is used to position SVG elements on SVG paths. Therefore the start value of the path and the end value of the path have to be defined. The position is then interpolated linearly between start and end.
This is a powerful animation to position SVG elements, because the position can be drawn as path in the svg itself.
Attribute | Domain | Description |
---|---|---|
name | String | The id of the path in the SVG image |
start | Float | The start position of the path. When the position value is the same as the value of this attribute, the object will be position at the beginning of the path. |
end | Float | The end position of the path. When the position value is the same as the value of this, the object will be position at the end of the path. |
length | Float | The length of the path. Can be used instead the absolute end position. In this case the end position is calculated as |
position | Float | Used to set a fixed position on the path. Normally the position is taken from a variable in the simulation data pool, but it can also be set to a fixed value with this attribute. The value should be between start and end of the path |
autoOrientation | Boolean, true / false | Determines if the object should also align its rotation to the path |
angleOffset | Integer | When autoOrientation is true, this offset in degrees is added to the calculated rotation on the path. For example if the element is facing with in the wrong direction when it is walking the path, an offset of 180 can be used to turn it. |
angle | see rotate animation | see rotate animation |
anchorX | see rotate animation | see rotate animation |
anchorY | see rotate animation | see rotate animation |
Interaction with the Simulation
...