Sättigungseffekt mit SVG-Farbmatrix in C#

Ist Ihnen schon einmal aufgefallen, dass einige Bilder im Internet zu hell aussehen oder die Farben einfach nicht richtig stimmen? Dies liegt an einem Phänomen, das als Sättigungseffekt bezeichnet wird. In diesem Artikel erfahren Sie, wie Sie den Sättigungseffekt mit einer SVG-Farbmatrix in C# erzielen.

Zunächst lernen wir den Sättigungseffekt kennen und werfen einen Blick auf die C# SVG-API, um den SVG-Farbmatrixfilter anzuwenden. Als Nächstes gehen wir durch die Schritte zum Korrigieren des Sättigungseffekts, indem wir die Farbmatrix verwenden, um die Farben in einem Bild anzupassen. Abschließend stellen wir Ihnen nützliche Links für weitere Verbesserungen zur Verfügung. Also lasst uns anfangen!

Dieser Artikel soll folgende Themen behandeln:

  1. Was ist Sättigungseffekt und SVG-Farbmatrix
  2. C#-SVG-API für Sättigungseffekt mit Farbmatrix
  3. So verwenden Sie die SVG-Farbmatrix für den Sättigungseffekt
  4. Sättigungseffekt mit Farbmatrix in C# erstellen

Was ist Sättigungseffekt und SVG-Farbmatrix?

Der Sättigungseffekt ist eine gängige Bildverarbeitungstechnik, die verwendet wird, um ein Bild lebendiger erscheinen zu lassen. Sie beschreibt die Intensität der Farbe.

Der Sättigungseffekt wird durch die Art und Weise verursacht, wie unser Gehirn Farbe verarbeitet. Wenn wir ein Bild sehen, passt unser Gehirn automatisch die Farben an, damit sie natürlicher aussehen. Wenn ein Bild jedoch zu viel Farbe hat oder die Farben nicht gleichmäßig ausbalanciert sind, hat es unser Gehirn schwerer, das Bild zu verarbeiten, was zu einem Sättigungseffekt führen kann.

Wir können den Sättigungseffekt mit dem SVG-Filterelement erzielen. Es bietet einen Filter für Farbtransformationen, um Farben basierend auf einer Transformationsmatrix zu ändern.

C#-SVG-API für Sättigungseffekt mit Farbmatrix

Der Sättigungseffekt ist ein Spezialfall der Verwendung der Farbmatrix. Wir werden die API Aspose.SVG for .NET verwenden, um die Sättigungsoperation des Filterprimitives zu verwenden. Die API ermöglicht das Laden, Analysieren, Rendern, Erstellen und Konvertieren von SVG-Dateien in gängige Formate ohne Softwareabhängigkeiten.

Bitte laden Sie die DLL der API herunter oder installieren Sie sie mit NuGet.

PM> Install-Package Aspose.SVG

So verwenden Sie die SVG-Farbmatrix für den Sättigungseffekt

Die wendet eine Matrixtransformation auf die RGBA-Kanäle jedes Pixels im Eingabebild an. Wir können das SVG-Element für den Sättigungseffekt verwenden, indem wir die folgenden Schritte ausführen:

  1. Definieren Sie ein SVG-Dokument und legen Sie die SVG-Namespace-URL fest.
  2. Erstellen Sie ein Bildelement und ein Filterelement.
  3. Grafikelement anhängen.
  4. Erstellen Sie ein feColorMatrix-Element und fügen Sie es dem Filterelement hinzu.
  5. Speichern Sie das ausgegebene SVG-Bild.

Im folgenden Abschnitt wird beschrieben, wie Sie diese Schritte in C#-Code umwandeln und einen Sättigungseffekt in SVG erstellen.

Erstellen Sie einen Sättigungseffekt mit Color Matrix in C#

Wir können einen Sättigungseffekt mit dem Element erzeugen, indem wir die folgenden Schritte ausführen:

  1. Erstellen Sie zunächst eine Instanz der Klasse SVGDocument.
  2. Greifen Sie als Nächstes auf das Root-SVG-Element zu und geben Sie die Namespace-URL für SVG an.
  3. Initialisieren Sie dann das Klassenobjekt SVGImageElement.
  4. Legen Sie in der Zwischenzeit einen Bildpfad und andere Eigenschaften für das SVGImageElement fest.
  5. Definieren Sie als Nächstes das Klassenobjekt SVGDefsElement und fügen Sie es dem Stammelement hinzu.
  6. Erstellen Sie dann das Klassenobjekt SVGFilterElement und fügen Sie es dem SVGDefsElement hinzu.
  7. Definieren Sie als Nächstes das Klassenobjekt SVGFEColorMatrixElement.
  8. Legen Sie dann die erforderlichen Attribute fest, z. B. Typ: Sättigung
  9. Fügen Sie danach das SVGFEColorMatrixElement zum SVGFilterElement hinzu.
  10. Speichern Sie abschließend die ausgegebene SVG-Datei mit der Methode Save().

Das folgende Codebeispiel zeigt, wie Sie mit der Farbmatrix in C# einen Sättigungseffekt erzeugen.

// Dieses Codebeispiel zeigt, wie Sie mit der Farbmatrix in C# einen Sättigungseffekt erstellen.
// Erstellen Sie eine Instanz des SVGDocument
var document = new SVGDocument();

// Holen Sie sich das Root-Svg-Element des Dokuments
var svgElement = document.RootElement;

const string SvgNamespace = "http://www.w3.org/2000/svg";

var imageElement = (SVGImageElement)document.CreateElementNS(SvgNamespace, "image");
imageElement.Href.BaseVal = @"C:\Files\lighthouse.jpg";
imageElement.Height.BaseVal.ConvertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PX);
imageElement.Width.BaseVal.ConvertToSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PX);
imageElement.Height.BaseVal.Value = 640;
imageElement.Width.BaseVal.Value = 480;
imageElement.X.BaseVal.Value = 20;
imageElement.Y.BaseVal.Value = 20;
imageElement.SetAttribute("filter", "url(#CM)");
svgElement.AppendChild(imageElement);

// Erstellen Sie ein defs-Element und fügen Sie es dem svgElement hinzu
Aspose.Svg.SVGDefsElement defsElement = (Aspose.Svg.SVGDefsElement)document.CreateElementNS(SvgNamespace, "defs");
svgElement.AppendChild(defsElement);

// Erstellen Sie ein Filterelement und fügen Sie es dem defsElement hinzu
Aspose.Svg.SVGFilterElement filterElement = (Aspose.Svg.SVGFilterElement)document.CreateElementNS(SvgNamespace, "filter");
defsElement.AppendChild(filterElement);

// Erstellen Sie ein feColorMatrix-Element
var feColorMatrixElement = (SVGFEColorMatrixElement)document.CreateElementNS(SvgNamespace, "feColorMatrix");
feColorMatrixElement.In1.BaseVal = "SourceGraphic";
feColorMatrixElement.SetAttribute("type", "saturate");
feColorMatrixElement.SetAttribute("values", "2");
filterElement.Id = "CM";

// An Filterelement anhängen
filterElement.AppendChild(feColorMatrixElement);

// Speichern Sie das SVG-Dokument
document.Save("C:\\Files\\ColorEffect.svg");
Quellbild Leuchtturm.jpg

Eingangsbild der Quelle

Sättigungseffekt mit SVG-Farbmatrix

Sättigungseffekt mit SVG-Farbmatrix in C#

<svg xmlns="http://www.w3.org/2000/svg">
    <image href="file:///C:/Files/lighthouse.jpg" height="640" width="480" x="20" y="20" filter="url(#CM)"/>
    <defs>
        <filter id="CM">
            <feColorMatrix in="SourceGraphic" type="saturate" values="2"/>
        </filter>
    </defs>
</svg>

Holen Sie sich eine kostenlose API-Lizenz

Sie können eine kostenlose temporäre Lizenz erhalten, um die Bibliothek ohne Evaluierungseinschränkungen zu testen.

Fazit

In diesem Artikel haben Sie den Sättigungseffekt auf Bilder kennengelernt. Wir haben auch gesehen, wie Sie den Farbsättigungseffekt mit den SVG-Farbmatrixfiltern in C# anwenden. Außerdem können Sie mithilfe von Dokumentation mehr über Aspose.SVG für .NET erfahren und verschiedene Funktionen erkunden, die von der API angeboten werden. Bei Unklarheiten können Sie sich gerne in unserem kostenlosen Support-Forum an uns wenden.

Siehe auch