8.3Die Skalierung
Mit Hilfe der Skalierung lassen sich Objekte vergrößern oder verkleinern. Der dazugehörige Befehl nennt sich scale(x-Skalierung [y-Skalierung])
. Auch hier darf der zweite Parameter entfallen. Wird dieser nicht angegeben, erhält er automatisch den Wert des ersten, d.h. es wird eine proportionale Skalierung durchgeführt.
<?xml version="1.0"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg"> <!-- Original-Rechteck --> <rect x="0" y="0" width="200" height="100" style="fill:none;stroke:grey;stroke-width:2px" /> <!-- transformiertes Rechteck --> <rect x="0" y="0" width="200" height="100" style="fill:#00FF00;stroke:black;stroke-width:2px" transform="scale(0.5)" /> </svg>
scale()
in Aktion
Wie man in dem Beispiel des Abschnitts Was sind Transformationen? sehen konnte, kann sich die Position eines Objekts während einer Skalierung ändern. Häufig ist dies jedoch nicht erwünscht. Abhilfe schaffen zwei simple Translationen. Zuerst wird das zu transformierende Objekt bzw. dessen Ankerpunkt auf den Nullpunkt geschoben. Anschließend erfolgt die gewünschte Skalierung und danach das Zurückschieben an die Ausgangsposition. Möchte man beispielsweise ein Rechteck, dessen linke obere Ecke sich an der Position (10,10) befindet, um den Faktor zwei skalieren, so benötigt man folgende Anweisung:
transform="translate(10, 10) scale(2) translate(-10, -10)"
.