Эффект насыщенности с использованием цветовой матрицы SVG в C#

Вы когда-нибудь замечали, что некоторые изображения в Интернете выглядят слишком яркими или цвета просто не совсем правильные? Это происходит из-за явления, называемого эффектом насыщения. В этой статье мы узнаем, как добиться эффекта насыщения с помощью цветовой матрицы SVG в C#.

Во-первых, мы узнаем об эффекте насыщения и взглянем на C# SVG API, чтобы применить фильтр цветовой матрицы SVG. Далее мы рассмотрим, как исправить эффект насыщенности, используя цветовую матрицу для настройки цветов в изображении. Наконец, мы предоставим полезные ссылки для дальнейших улучшений. Итак, приступим!

Эта статья должна охватывать следующие темы:

  1. Что такое эффект насыщенности и цветовая матрица SVG
  2. C# SVG API для эффекта насыщенности с использованием цветовой матрицы
  3. Как использовать цветовую матрицу SVG для эффекта насыщенности
  4. Создание эффекта насыщенности с помощью цветовой матрицы в C#

Что такое эффект насыщенности и цветовая матрица SVG

Эффект насыщенности — это распространенный метод обработки изображений, который используется для придания изображению большей яркости. Он описывает интенсивность цвета.

Эффект насыщения вызван тем, как наш мозг обрабатывает цвета. Когда мы видим изображение, наш мозг автоматически регулирует цвета, чтобы они выглядели более естественными. Однако, когда изображение имеет слишком много цветов или цвета неравномерно сбалансированы, нашему мозгу труднее обрабатывать изображение, что может вызвать эффект насыщения.

Мы можем добиться эффекта насыщения, используя фильтрующий элемент SVG. Он предоставляет фильтр для преобразования цвета для изменения цвета на основе матрицы преобразования.

С# SVG API для эффекта насыщенности с использованием цветовой матрицы

Эффект насыщения — это частный случай использования цветовой матрицы. Мы будем использовать API Aspose.SVG для .NET для использования операции насыщения примитива фильтра . API позволяет загружать, анализировать, отображать, создавать и преобразовывать файлы SVG в популярные форматы без каких-либо программных зависимостей.

Пожалуйста, загрузите DLL API или установите его с помощью NuGet.

PM> Install-Package Aspose.SVG

Как использовать цветовую матрицу SVG для эффекта насыщенности

применяет матричное преобразование к каналам RGBA каждого пикселя во входном изображении. Мы можем использовать элемент SVG для эффекта насыщенности, выполнив шаги, указанные ниже:

  1. Определите документ SVG и задайте URL-адрес пространства имен SVG.
  2. Создайте элемент изображения и элемент фильтра.
  3. Добавьте графический элемент.
  4. Создайте элемент feColorMatrix и добавьте его в элемент фильтра.
  5. Сохраните выходное изображение SVG.

В следующем разделе описывается, как преобразовать эти шаги в код C# и создать эффект насыщения в SVG.

Создайте эффект насыщенности, используя цветовую матрицу в C#

Мы можем создать эффект насыщения с помощью элемента , выполнив шаги, указанные ниже:

  1. Во-первых, создайте экземпляр класса SVGDocument.
  2. Затем получите доступ к корневому элементу SVG и укажите URL-адрес пространства имен для SVG.
  3. Затем инициализируйте объект класса SVGImageElement.
  4. Тем временем задайте путь к изображению и другие свойства для SVGImageElement.
  5. Затем определите объект класса SVGDefsElement и добавьте его в корневой элемент.
  6. Затем создайте объект класса SVGFilterElement и добавьте его в SVGDefsElement.
  7. Затем определите объект класса SVGFEColorMatrixElement.
  8. Затем установите необходимые атрибуты ig type: saturate
  9. После этого добавьте SVGFEColorMatrixElement в SVGFilterElement.
  10. Наконец, сохраните выходной SVG-файл, используя метод Save().

В следующем примере кода показано, как создать эффект насыщения с помощью цветовой матрицы в C#.

// В этом примере кода показано, как создать эффект насыщения с помощью цветовой матрицы в C#.
// Создайте экземпляр SVGDocument
var document = new SVGDocument();

// Получить корневой элемент svg документа
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);

// Создайте элемент defs и добавьте его в svgElement.
Aspose.Svg.SVGDefsElement defsElement = (Aspose.Svg.SVGDefsElement)document.CreateElementNS(SvgNamespace, "defs");
svgElement.AppendChild(defsElement);

// Создайте фильтрующий элемент и добавьте его в defsElement.
Aspose.Svg.SVGFilterElement filterElement = (Aspose.Svg.SVGFilterElement)document.CreateElementNS(SvgNamespace, "filter");
defsElement.AppendChild(filterElement);

// Создайте элемент feColorMatrix
var feColorMatrixElement = (SVGFEColorMatrixElement)document.CreateElementNS(SvgNamespace, "feColorMatrix");
feColorMatrixElement.In1.BaseVal = "SourceGraphic";
feColorMatrixElement.SetAttribute("type", "saturate");
feColorMatrixElement.SetAttribute("values", "2");
filterElement.Id = "CM";

// Добавить к фильтрующему элементу
filterElement.AppendChild(feColorMatrixElement);

// Сохраните документ SVG.
document.Save("C:\\Files\\ColorEffect.svg");
Исходное изображение маяк.jpg

Исходное входное изображение

Эффект насыщенности с использованием цветовой матрицы SVG

Эффект насыщенности с использованием цветовой матрицы SVG в 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>

Получите бесплатную лицензию API

Вы можете получить бесплатную временную лицензию, чтобы попробовать библиотеку без ограничений пробной версии.

Вывод

В этой статье вы узнали об эффекте насыщенности изображений. Мы также увидели, как применить цветовой эффект насыщенности с помощью фильтров цветовой матрицы SVG в C#. Кроме того, вы можете узнать больше об Aspose.SVG для .NET с помощью документации и изучить различные функции, предлагаемые API. В случае возникновения каких-либо неясностей, пожалуйста, свяжитесь с нами на нашем бесплатном форуме поддержки.

Смотрите также