3 Fragen zu Fecomposite

Das SVG-Element `<feComposite>` wird in SVG-Filtereffekten verwendet, um zwei Bilder (bzw. Bilddatenströme) miteinander zu kombinieren. In deinem Beispiel: ```xml <feComposite operator="over" in="shadow" in2="SourceGraphic"></feComposite> ``` bedeutet das Folgendes: - **operator="over"**: Das ist der Standard-Operator und entspricht dem klassischen „Überlagern“ (wie bei Ebenen in Photoshop). Das Bild aus `in` (hier: "shadow") wird über das Bild aus `in2` (hier: "SourceGraphic") gelegt. - **in="shadow"**: Das ist die Eingabe 1, meist das Ergebnis eines vorherigen Filter-Schritts, z.B. ein Schatten. - **in2="SourceGraphic"**: Das ist die Eingabe 2, meist das Originalbild. **Zusammengefasst:** Mit diesem Filter-Schritt wird das Bild aus dem Kanal „shadow“ über das Originalbild („SourceGraphic“) gelegt. Das ist z.B. typisch, um einen Schatteneffekt zu erzeugen, bei dem der Schatten unter dem eigentlichen Bild sichtbar ist. **Weitere Infos:** - [MDN: feComposite](https://developer.mozilla.org/de/docs/Web/SVG/Element/feComposite) - [SVG-Filter-Grundlagen](https://developer.mozilla.org/de/docs/Web/SVG/Tutorial/Filter)

Im Kontext von SVG-Filtern und speziell dem `<feComposite>`-Element bedeutet das Attribut `operator="out"` Folgendes: - **`in="SourceGraphic"`**: Das ist das Originalbild oder die ursprüngliche Grafik. - **`in2="offset-display"`**: Das ist ein zweites Eingabebild, das z.B. durch einen vorherigen Filtereffekt (wie ein verschobener Schatten) erzeugt wurde. - **`operator="out"`**: Dieser Operator sorgt dafür, dass aus dem ersten Bild (`in`) alle Bereiche entfernt werden, die im zweiten Bild (`in2`) sichtbar sind. Es bleibt also nur der Teil von `SourceGraphic` übrig, der **nicht** von `offset-display` überlappt wird. Das Ergebnis wird im Attribut `result="inverse"` gespeichert. Das heißt, der Name "inverse" ist hier frei gewählt und bezeichnet das Filterergebnis, das du später im Filterverlauf weiterverwenden kannst. **Zusammengefasst:** `<feComposite operator="out" in="SourceGraphic" in2="offset-display" result="inverse">` bedeutet: Erzeuge ein Bild, das nur die Teile von `SourceGraphic` enthält, die **nicht** von `offset-display` überdeckt werden, und speichere dieses Ergebnis unter dem Namen "inverse". Weitere Infos findest du in der [MDN-Dokumentation zu feComposite](https://developer.mozilla.org/de/docs/Web/SVG/Element/feComposite).

Der SVG-Filter-Effekt, den du beschreibst, verwendet das `<feComposite>`-Element mit dem Operator `"out"`. Dieser Operator entfernt die Bereiche von `in2` aus `in`. In deinem Beispiel: ```xml <feComposite operator="out" in="SourceGraphic" in2="offset-display" result="inverse"></feComposite> ``` - `in="SourceGraphic"`: Das Originalbild. - `in2="offset-display"`: Ein zweites Bild, meist ein verschobener oder bearbeiteter Bereich. - `operator="out"`: Entfernt die Bereiche von `in2` aus `in`. **Unblur** bedeutet, einen Weichzeichner (Blur) rückgängig zu machen. Das ist mit SVG-Filtern nicht direkt möglich, da ein Blur-Filter Informationen entfernt, die nicht einfach wiederhergestellt werden können. Es gibt keinen SVG-Filter, der ein Bild "ent-blurrt". **Was macht dein Filter?** Mit dem `operator="out"` schneidest du Bereiche aus dem Originalbild aus, die im `offset-display` enthalten sind. Das ist kein "Unblur", sondern ein Maskieren/Ausschneiden. **Fazit:** - Ein "Unblur" ist mit SVG-Filtern technisch nicht möglich. - Der von dir genutzte Filter schneidet Bereiche aus, entfernt aber keinen Blur. - Um einen Blur rückgängig zu machen, bräuchtest du das Originalbild ohne Blur. **Weitere Infos zu SVG-Filtern:** - [MDN: feComposite](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/feComposite) - [MDN: SVG Filter Effects](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Filter_effects) Falls du einen bestimmten Effekt erzielen möchtest, beschreibe bitte genauer, was du erreichen willst.