KnobConfigVertical
Für die Darstellung des Sliders läßt sich eine andere Grafik wählen.
Diese Definition trifft nur Gauges welche über das Attribut Orientation vertikal ausgerichtet sind. Ist das Control horizontal positioniert, so wird die Ressource KnobConfigHorizontal genutzt.
Es muss der Pfad der Bilddatei sowie die Anzeigegröße des Bildes angegeben werden. Weiterhin kann der Versatz des "Ankerpunktes" festgelegt werden. So kann das Bild korrekt bezüglich des Wertebalkens positioniert werden.
Beachten Sie, dass eine SVG-Datei einen eigenen Viewport öffnet und daher im Normalfall das Seitenverhältnis nicht verändert werden kann.
Auch teiltransparente Bilder im PNG und SVG Format werden unterstützt. Bei Pixelgrafiken (PNG, JPG) ist zu beachten, dass die Attribute KnobColor und KnobArrowsColor keine Auswirkungen haben. Wird ein SVG genutzt, kann die Farbdefinition greifen, wenn das SVG entsprechend vorbereitet wird.
Beim Laden wird folgende Zeichenersetzung im SVG durchgeführt:
{KnobColorStroke}
wird bei gesetzter KnobColor ersetzt durch "stroke:
" gefolgt von der KnobColor als CSS Farbe, ansonsten entfernt{KnobColorFill}
wird bei gesetzter KnobColor ersetzt durch "fill:
" gefolgt von der KnobColor als CSS Farbe, ansonsten entfernt{KnobColorGradientDefinition}
wird, wenn KnobColor eine LinearGradientColor ist, ersetzt durch ein passendes SVG<linearGradient>
Element als String, ansonsten entfernt{KnobArrowsColorStroke}
wird bei gesetzter KnobArrowsColor ersetzt durch "stroke:
" gefolgt von der KnobArrowsColor als CSS Farbe, ansonsten entfernt{KnobArrowsColorFill}
wird bei gesetzter KnobArrowsColor ersetzt durch "fill:
" gefolgt von der KnobArrowsColor als CSS Farbe, ansonsten entfernt{KnobArrowsColorGradientDefinition}
wird, wenn KnobArrowsColor eine LinearGradientColor ist, ersetzt durch ein passendes SVG<linearGradient>
Element als String, ansonsten entfernt
Beispiel SVG
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="40" height="40">
<defs>{KnobColorGradientDefinition}</defs>
<circle r="18px" cx="20px" cy="20px"
style="stroke-width:3px;{KnobColorFill}{KnobArrowsColorStroke}"></circle>
<path d="M 18 11 L 16 11 L 7 20 L 16 29 L 18 29 L 18 27 L 11 20 L 18 13 Z"
style="stroke:none;{KnobArrowsColorFill}"></path>
<path d="M 22 13 L 24 11 L 33 20 L 24 29 L 22 29 L 22 27 L 29 20 L 22 13 Z"
style="stroke:none;{KnobArrowsColorFill}"></path>
</svg>
Schema: tchmi:framework#/definitions/KnobDefinition
Herkunft: Linear Gauge
Verfügbar ab Version 1.10 |