Murphy: Farbverlauf an Pfad ausrichten?`

Hallo,

ich würde gerne eine SVG-Datei mit einem etwas komplexeren Farbverlauf ausstatten, weiß aber nicht, ob das überhaupt möglich ist, wie ich es mir vorstelle, oder nach welchem Keyword ich da suchen muss.

Und zwar hätte ich es gerne so, dass der Farbverlauf dem Pfad des Objektes folgt, den es füllt. Unmittelbar an der Kante soll also die Startfarbe verwendet werden, und je weiter es ins "Innere" des Objekts geht, desto stärker soll die zweite Farbe verwendet werden.

Lässt sich einigermaßen verstehen, was ich meine? Wäre mein Objekt ein Kreis, dann ergäbe es einen perfekten radialen Farbverlauf.

  1. Hallo Murphy,

    Und zwar hätte ich es gerne so, dass der Farbverlauf dem Pfad des Objektes folgt, den es füllt. Unmittelbar an der Kante soll also die Startfarbe verwendet werden, und je weiter es ins "Innere" des Objekts geht, desto stärker soll die zweite Farbe verwendet werden.

    Lässt sich einigermaßen verstehen, was ich meine? Wäre mein Objekt ein Kreis, dann ergäbe es einen perfekten radialen Farbverlauf.

    Was hast Du denn probiert? SVG kennt aktuell die Elemente linearGradient und radialGradient, wobei auch radiale Gradienten auf nicht-kreisförmige Objekt angewendet werden können.

    BTW: Komplexere Mesh Gradients werden in SVG 2 hinzukommen.

    Grüße,
    Thomas

    1. Was hast Du denn probiert? SVG kennt aktuell die Elemente linearGradient und radialGradient, wobei auch radiale Gradienten auf nicht-kreisförmige Objekt angewendet werden können.

      Naja, ich habe es mit radialGradient in verschiedenen Variationen und mit diversen gradientTransformations probiert.
      Natürlich kann ein kreisförmiger Gradient auch auf nicht kreisförmige Objekte angewendet werden, aber es ändert ja nichts daran, dass er (zumindest habe ich bisher nichts anderes gefunden) dabei immer kreisförmig (bzw. elliptisch) bleibt.
      Das heißt es gibt einen definierten Mittelpunkt, der eine Farbe hat, und je weiter man sich von dem Mittelpunkt entfernt, desto mehr geht der Gradient in die andere Farbe hinein. Wenn das Objekt konkav ist, dann wird die Farbe einfach "abgeschnitten".
      Was ich halt suche ist genau das Gegenteil: Am Rand der Form soll immer die eine Farbe vorherschen und je weiter ein Punkt vom Rand (bzw. sämtlichen Rändern) entfernt ist, desto mehr soll es die andere Farbe sein. Ist das Objekt besonders schmal wird die Zielfarbe evtl. gar nicht erreicht.

      (Sollte meine Erklärung unklar sein, kann ich gerne nach ein paar Beispiel-Bildern suchen)

      BTW: Komplexere Mesh Gradients werden in SVG 2 hinzukommen.

      Ich bin mir nicht sicher, ob dies die Art von Gradient ist, die ich suche.

      1. Hallo Murphy,

        Was ich halt suche ist genau das Gegenteil: Am Rand der Form soll immer die eine Farbe vorherschen und je weiter ein Punkt vom Rand (bzw. sämtlichen Rändern) entfernt ist, desto mehr soll es die andere Farbe sein. Ist das Objekt besonders schmal wird die Zielfarbe evtl. gar nicht erreicht.

        Probiere es mal mit den Werkzeugen von Inkscape (Objekt -> Füllung und Kontur…). Vielleicht taugt auch ein Filter.

        Grüße,
        Thomas