คุณเคยสังเกตไหมว่าภาพบางภาพบนอินเทอร์เน็ตดูสว่างเกินไป หรือสีไม่ตรงนัก? นี่เป็นเพราะปรากฏการณ์ที่เรียกว่าเอฟเฟกต์ความอิ่มตัว ในบทความนี้ เราจะมาเรียนรู้วิธีสร้างเอฟเฟ็กต์ความอิ่มตัวด้วยเมทริกซ์สี SVG ใน C#
ประการแรก เราจะเรียนรู้เกี่ยวกับเอฟเฟกต์ความอิ่มตัวของสีและดูที่ C# SVG API เพื่อใช้ตัวกรองเมทริกซ์สี SVG ต่อไป เราจะอธิบายขั้นตอนการแก้ไขเอฟเฟ็กต์ความอิ่มตัวของสีโดยใช้เมทริกซ์สีเพื่อปรับสีในรูปภาพ สุดท้าย เราจะให้ลิงก์ที่มีประโยชน์สำหรับการปรับปรุงเพิ่มเติม เริ่มกันเลย!
บทความนี้จะครอบคลุมหัวข้อต่อไปนี้:
- เอฟเฟ็กต์ความอิ่มสีและเมทริกซ์สี SVG คืออะไร
- C# SVG API สำหรับเอฟเฟ็กต์ความอิ่มตัวโดยใช้เมทริกซ์สี
- วิธีใช้เมทริกซ์สี SVG สำหรับเอฟเฟ็กต์ความอิ่มตัว
- สร้างเอฟเฟ็กต์ความอิ่มสีโดยใช้เมทริกซ์สีใน C#
เอฟเฟกต์ความอิ่มตัวและเมทริกซ์สี SVG คืออะไร
เอฟเฟ็กต์ความอิ่มสีเป็นเทคนิคการประมวลผลภาพทั่วไปที่ใช้เพื่อทำให้ภาพดูสดใสขึ้น เป็นการอธิบายความเข้มของสี
เอฟเฟกต์ความอิ่มตัวเกิดจากวิธีที่สมองของเราประมวลผลสี เมื่อเราเห็นภาพ สมองของเราจะปรับสีโดยอัตโนมัติเพื่อให้ดูเป็นธรรมชาติมากขึ้น อย่างไรก็ตาม เมื่อภาพมีสีมากเกินไปหรือสีไม่สมดุลเท่ากัน สมองของเราจะประมวลผลภาพได้ยากขึ้น ซึ่งอาจทำให้เกิดเอฟเฟกต์ความอิ่มตัวได้
เราสามารถบรรลุเอฟเฟ็กต์ความอิ่มตัวได้โดยใช้องค์ประกอบตัวกรอง SVG มันมีตัวกรองสำหรับการเปลี่ยนสีเพื่อเปลี่ยนสีตามเมทริกซ์การแปลง
C# SVG API สำหรับเอฟเฟกต์ความอิ่มตัวโดยใช้เมทริกซ์สี
เอฟเฟกต์ความอิ่มตัวเป็นกรณีพิเศษของการใช้เมทริกซ์สี เราจะใช้ Aspose.SVG for .NET API สำหรับการใช้การดำเนินการความอิ่มตัวของตัวกรองดั้งเดิม API อนุญาตให้โหลด แยกวิเคราะห์ แสดงผล สร้าง และแปลงไฟล์ SVG เป็น รูปแบบยอดนิยม โดยไม่ต้องพึ่งพาซอฟต์แวร์ใดๆ
โปรด ดาวน์โหลด DLL ของ API หรือติดตั้งโดยใช้ NuGet
PM> Install-Package Aspose.SVG
วิธีใช้เมทริกซ์สี SVG สำหรับเอฟเฟกต์ความอิ่มตัว
ใช้การแปลงเมทริกซ์กับช่อง RGBA ของแต่ละพิกเซลในภาพอินพุต เราสามารถใช้องค์ประกอบ SVG สำหรับเอฟเฟกต์ความอิ่มตัวโดยทำตามขั้นตอนด้านล่าง:
- กำหนดเอกสาร SVG และตั้งค่า URL เนมสเปซ SVG
- สร้างองค์ประกอบรูปภาพและองค์ประกอบตัวกรอง
- ผนวกองค์ประกอบกราฟิก
- สร้างองค์ประกอบ feColorMatrix และเพิ่มไปยังองค์ประกอบตัวกรอง
- บันทึกภาพ SVG เอาต์พุต
ส่วนต่อไปนี้จะอธิบายวิธีแปลงขั้นตอนเหล่านี้เป็นโค้ด C# และสร้างเอฟเฟ็กต์ความอิ่มตัวใน SVG
สร้างเอฟเฟกต์ความอิ่มตัวโดยใช้ Color Matrix ใน C#
เราสามารถสร้างเอฟเฟ็กต์ความอิ่มตัวโดยใช้องค์ประกอบ โดยทำตามขั้นตอนด้านล่าง:
- ขั้นแรก สร้างอินสแตนซ์ของคลาส SVGDocument
- ถัดไป เข้าถึงองค์ประกอบ SVG รูท และระบุเนมสเปซ URL สำหรับ SVG
- จากนั้น เริ่มต้นวัตถุคลาส SVGImageElement
- ในขณะเดียวกัน ให้ตั้งค่าเส้นทางรูปภาพและคุณสมบัติอื่นๆ สำหรับ SVGImageElement
- จากนั้น กำหนดคลาสอ็อบเจกต์ SVGDefsElement และเพิ่มไปยังองค์ประกอบรูท
- จากนั้น สร้างวัตถุคลาส SVGFilterElement และเพิ่มไปยัง SVGDefsElement
- ถัดไป กำหนดวัตถุคลาส SVGFEColorMatrixElement
- จากนั้นตั้งค่าแอตทริบิวต์ที่ต้องการ ig type: saturate
- หลังจากนั้น ให้เพิ่ม SVGFEColorMatrixElement ไปยัง SVGFilterElement
- สุดท้าย บันทึกไฟล์ 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");
<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 ในกรณีที่มีความคลุมเครือ โปรดติดต่อเราได้ที่ ฟอรัมสนับสนุนฟรี