SVG/Elemente/feOffset

Aus SELFHTML-Wiki
< SVG‎ | Elemente
Wechseln zu: Navigation, Suche

Das feOffset-Element verschiebt eine Grafik. Er verhält sich also ähnlich wie transform:translate(), nur eben innerhalb eines Filters. In der Praxis wird feOffset häufig in Zusammenhang mit anderen Filtern verwendet, um einen Schatten zu erzeugen.

Beispiel
<filter id="f1" x="0" y="0" width="200%" height="200%">
    <feOffset in="SourceGraphic" result="translatedObject"  dx="20" dy="20" />
    <feMerge>
      <feMergeNode in="f1"/>
      <feMergeNode in="SourceGraphic"/>
    </feMerge>
  </filter>


Siehe auch

Weblinks

W3C (Spezifikation): feMerge Element

Start-Tag: notwendig
End-Tag: ggf. notwendig
<feOffset />
<feOffset>
  <!-- Kindelement(e) -->
</feOffset>
Elternelemente Darf vorkommen in:

filter

erlaubte Inhalte

animate, set

Browsersupport Details: {{{caniuse}}}
Attribute
Name Inhalt Standardwert Bedeutung
Kernattribute
class ID ordnet ein Element einer oder mehreren Klassen zu.
id ID identifiziert ein einziges Element innerhalb eines Dokuments
lang ID identifiziert eine Sprachangabe
style ID CDATA Stilangabe durch Präsentationsattribute
tabindex ID macht Element „antabbbar“
xml:base CDATA Basis-URL
xml:lang Sprachkürzel legt eine den IANA-Sprachdefinitionen folgende Sprache des Elementinhalts fest [RFC1766]
xml:space default, preserve Verhalten gegenüber whitespace)


in CDATA
dx NUMBER Verschiebung auf der X-Achse
dy NUMBER Verschiebung auf der Y-Achse

Attribut: Pflichtattribut
Attribut: optionales Attribut