เอฟเฟกต์ความอิ่มตัวโดยใช้ SVG Color Matrix ใน C#

คุณเคยสังเกตไหมว่าภาพบางภาพบนอินเทอร์เน็ตดูสว่างเกินไป หรือสีไม่ตรงนัก? นี่เป็นเพราะปรากฏการณ์ที่เรียกว่าเอฟเฟกต์ความอิ่มตัว ในบทความนี้ เราจะมาเรียนรู้วิธีสร้างเอฟเฟ็กต์ความอิ่มตัวด้วยเมทริกซ์สี SVG ใน C#

ประการแรก เราจะเรียนรู้เกี่ยวกับเอฟเฟกต์ความอิ่มตัวของสีและดูที่ C# SVG API เพื่อใช้ตัวกรองเมทริกซ์สี SVG ต่อไป เราจะอธิบายขั้นตอนการแก้ไขเอฟเฟ็กต์ความอิ่มตัวของสีโดยใช้เมทริกซ์สีเพื่อปรับสีในรูปภาพ สุดท้าย เราจะให้ลิงก์ที่มีประโยชน์สำหรับการปรับปรุงเพิ่มเติม เริ่มกันเลย!

บทความนี้จะครอบคลุมหัวข้อต่อไปนี้:

  1. เอฟเฟ็กต์ความอิ่มสีและเมทริกซ์สี SVG คืออะไร
  2. C# SVG API สำหรับเอฟเฟ็กต์ความอิ่มตัวโดยใช้เมทริกซ์สี
  3. วิธีใช้เมทริกซ์สี SVG สำหรับเอฟเฟ็กต์ความอิ่มตัว
  4. สร้างเอฟเฟ็กต์ความอิ่มสีโดยใช้เมทริกซ์สีใน C#

เอฟเฟกต์ความอิ่มตัวและเมทริกซ์สี SVG คืออะไร

เอฟเฟ็กต์ความอิ่มสีเป็นเทคนิคการประมวลผลภาพทั่วไปที่ใช้เพื่อทำให้ภาพดูสดใสขึ้น เป็นการอธิบายความเข้มของสี

เอฟเฟกต์ความอิ่มตัวเกิดจากวิธีที่สมองของเราประมวลผลสี เมื่อเราเห็นภาพ สมองของเราจะปรับสีโดยอัตโนมัติเพื่อให้ดูเป็นธรรมชาติมากขึ้น อย่างไรก็ตาม เมื่อภาพมีสีมากเกินไปหรือสีไม่สมดุลเท่ากัน สมองของเราจะประมวลผลภาพได้ยากขึ้น ซึ่งอาจทำให้เกิดเอฟเฟกต์ความอิ่มตัวได้

เราสามารถบรรลุเอฟเฟ็กต์ความอิ่มตัวได้โดยใช้องค์ประกอบตัวกรอง SVG มันมีตัวกรองสำหรับการเปลี่ยนสีเพื่อเปลี่ยนสีตามเมทริกซ์การแปลง

C# SVG API สำหรับเอฟเฟกต์ความอิ่มตัวโดยใช้เมทริกซ์สี

เอฟเฟกต์ความอิ่มตัวเป็นกรณีพิเศษของการใช้เมทริกซ์สี เราจะใช้ Aspose.SVG for .NET API สำหรับการใช้การดำเนินการความอิ่มตัวของตัวกรองดั้งเดิม 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

สร้างเอฟเฟกต์ความอิ่มตัวโดยใช้ Color Matrix ใน 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");
ที่มาภาพ lighthouse.jpg

รูปภาพอินพุตแหล่งที่มา

เอฟเฟกต์ความอิ่มตัวโดยใช้เมทริกซ์สี SVG

เอฟเฟกต์ความอิ่มตัวโดยใช้ SVG Color Matrix ใน 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 for .NET โดยใช้ เอกสารประกอบ และสำรวจคุณสมบัติต่างๆ ที่นำเสนอโดย API ในกรณีที่มีความคลุมเครือ โปรดติดต่อเราได้ที่ ฟอรัมสนับสนุนฟรี

ดูสิ่งนี้ด้วย