Universalattribute für Filter-Elemente

(Auszug aus "Das Einsteigerseminar SVG — Webgrafiken mit XML" von Helma Spona)

Ähnlich wie bei vielen anderen SVG-Elementen gibt es auch für die Elemente eines <filter>-Tags Attribute, die generell oder fast durchgängig für alle Elemente verfügbar sind. Diese Attribute werden Universalattribute genannt. Sie stehen für fast alle <fe...>-Tags zur Verfügung.

Hinweis:
Sollte es im Einzelfall Abweichungen von den folgenden Erläuterungen geben, werden diese zu dem jeweiligen Filter-Element im Anschluss erläutert.

Die Universalattribute für Filter-Elemente sind:

  • x, y, width und height definieren zusammen einen Unterbereich für das Filterelement. Sie beziehen sich immer auf das Koordinatensystem des Filterbereichs, den Sie mit x, y, width und height im <filter>-Tag definiert haben. Wenn Sie die Attribute nicht angeben, bekommen Sie die Werte x="0%", y="0%", width="100%" und height="100%".
  • result legt den Namen fest, unter dem das Ergebnis des Filters gespeichert werden soll. Der Name, den Sie hier angeben, muss innerhalb aller Elemente im <filter>-Tag eindeutig sein und ist erforderlich, um das Ergebnis weiter verarbeiten zu können. Wenn Sie das Attribut nicht angeben, wird das Ergebnis des Filter-Elements automatisch an das nächste Filter-Element übergeben, sofern Sie in diesem Element nicht das in-Attribut verwenden.
  • in legt fest, welche Daten als Input für das Filter-Element dienen. Dies kann einer der Werte SourceGraphic, SourceAlpha, BackgroundImage, BackgroundAlpha, FillPaint, StrokePaint oder der Wert eines result-Attributs eines zuvor definierten Filter-Elements sein. Geben Sie SourceGraphic an, wird das Objekt selbst verwendet, auf das Sie den Filter anwenden. Bei Auswahl von SourceAlpha wird die Form des Objekts mit einer schwarzen Füllung verwendet, also die Alpha-Maske des Objekts. Wenn Sie hingegen BackgroundImage wählen, wird das Hintergrundbild als Input benutzt, bei BackgroundAlpha entsprechend die Alpha-Maske des Hintergrundbildes. Mit dem Wert FillPaint legen Sie fest, dass der Schatten mit der Füllung des Objekts erzeugt werden soll, und mit StrokePaint bestimmen Sie, dass die Füllung des Umrisses verwendet werden soll. Dabei wird jedoch nicht der Umriss des Objekts als Schatten abgebildet, sondern die rechteckige Fläche, die das Objekt ausfüllt. Lassen Sie das Attribut weg, wird ein Standardwert verwendet. Der ist abhängig davon, an welcher Position des <filter>-Tags das Filter-Element steht. Handelt es sich um das erste Filter-Element, wird die ursprüngliche Grafik, also die Einstellung SourceGraphic, verwendet. Gibt es vor diesem Filter-Element bereits ein anderes, wird dessen Ergebnis verwendet.

Zur Erläuterung folgt nun ein Beispiel. Zunächst soll der Schatten aus dem vorherigen Beispiel auf den Alpha-Kanal des Buttons und der Schrift angewendet werden. Dazu ist folgender Code erforderlich:

<filter id="AlphaSchatten" >
  <feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
</filter>

Das Ergebnis des SourceAlpha-Wertes für den Parameter in

Abbildung: Das Ergebnis des SourceAlpha-Wertes für den Parameter in.

Benutzen Sie hingegen für den Filter, den Sie der Schrift zuweisen, den Wert fillPaint für das Attribut in, dann sieht das Ergebnis des folgenden Listings wie folgt aus:

<filter id="StrokeSchatten">
  <feGaussianBlur in="FillPaint" stdDeviation="3"/>
</filter>

Links wird SourceAlpha, rechts FillPaint als Input verwendet

Abbildung: Links wird SourceAlpha, rechts FillPaint als Input verwendet.

   

<< zurück vor >>

 

 

 

Tipp der data2type-Redaktion:
Zum Thema SVG bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright © verlag moderne industrie GmbH 2001
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "Das Einsteigerseminar SVG — Webgrafiken mit XML" denselben Bestimmungen wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

verlag moderne industrie GmbH, Justus-von-Liebig-Straße 1, D-86899 Landsberg/Lech, fon ++49 (0) 81 91 / 125 – 0, leserservice(at)mi-verlag.de