รูปภาพ SVG กำลังได้รับความนิยมเนื่องจากความสามารถในการปรับขนาดและคุณสมบัติด้านคุณภาพ ในบางสถานการณ์ คุณอาจต้องเปลี่ยนสีของภาพ SVG เพื่อให้ดูน่าสนใจยิ่งขึ้น บทความนี้กล่าวถึงวิธีการเปลี่ยนสีขององค์ประกอบ SVG ต่างๆ โดยทางโปรแกรมใน C#
- ทำงานกับสีขององค์ประกอบ SVG - การติดตั้ง C# .NET API
- เปลี่ยนสีขององค์ประกอบวงกลมของ SVG ใน C#
- เปลี่ยนสีขององค์ประกอบเส้นของ SVG ใน C#
- ตั้งค่าสีพื้นหลังของภาพ SVG ใน C#
ทำงานกับสีขององค์ประกอบ SVG – การติดตั้ง C# .NET API
คุณสามารถปรับแต่งสีขององค์ประกอบ SVG ต่างๆ เช่น Circle, Line และอื่นๆ ด้วย Aspose.SVG for .NET API เพียงดาวน์โหลดไฟล์ DLL จาก New Releases หรือใช้คำสั่งติดตั้ง NuGet ต่อไปนี้:
PM> Install-Package Aspose.SVG
เปลี่ยนสีขององค์ประกอบวงกลมของ SVG ใน C#
คุณสามารถเปลี่ยนสีขององค์ประกอบวงกลมของ SVG ใน C# โดยทำตามขั้นตอนต่อไปนี้:
- สร้างอินสแตนซ์ของคลาส SVGDocument เพื่อโหลดไฟล์ SVG อินพุต
- รับรากและองค์ประกอบ SVG วงกลมของเอกสาร
- ตั้งค่าแอตทริบิวต์และสีสำหรับองค์ประกอบ SVG
- บันทึกภาพ SVG เอาต์พุต
ข้อมูลโค้ดด้านล่างอธิบายวิธีการเปลี่ยนสีขององค์ประกอบวงกลมของ SVG ใน C#:
// โหลดเอกสาร SVG จากไฟล์
SVGDocument document = new SVGDocument("shapes.svg");
// รับรูทองค์ประกอบ svg ของเอกสาร
SVGElement svgElement = document.RootElement;
// รับองค์ประกอบวงกลมเพื่อเปลี่ยนสี
SVGCircleElement circleElement = svgElement.QuerySelector("circle") as SVGCircleElement;
// ตั้งค่าแอตทริบิวต์ "เติม" ใหม่สำหรับองค์ประกอบวงกลม
circleElement.SetAttribute("fill", "blue");
// บันทึกเอกสาร SVG
document.Save("circle-color.svg");
เปลี่ยนสีขององค์ประกอบเส้นของ SVG ใน C#
โปรดทำตามขั้นตอนด้านล่างเพื่อเปลี่ยนสีขององค์ประกอบเส้นในภาพ SVG ใน C#:
- เริ่มต้นวัตถุของคลาส SVGDocument เพื่อโหลดภาพ SVG ต้นทาง
- รับองค์ประกอบรากและเส้นเพื่อปรับเปลี่ยนสี
- บันทึกไฟล์ SVG ที่ส่งออกโดยใช้เมธอด Save
ข้อมูลโค้ดต่อไปนี้แสดงวิธีเปลี่ยนสีเส้นในไฟล์ SVG โดยทางโปรแกรมใน C#:
// โหลดเอกสาร SVG จากไฟล์
SVGDocument document = new SVGDocument("basic-shapes.svg");
// รับรูทองค์ประกอบ svg ของเอกสาร
SVGSVGElement svgElement = document.RootElement;
// รับองค์ประกอบเส้นเพื่อเปลี่ยนสี
SVGLineElement lineElement = svgElement.QuerySelector("line") as SVGLineElement;
// ตั้งค่าแอตทริบิวต์ "เส้นขีด" ใหม่สำหรับองค์ประกอบเส้น
lineElement.SetAttribute("stroke", "blue");
// บันทึกเอกสาร SVG
document.Save("line-color.svg");
ตั้งค่าสีพื้นหลังของภาพ SVG ใน C#
คุณสามารถปรับปรุงรูปลักษณ์ของภาพ SVG ได้โดยตั้งค่าสีพื้นหลังของภาพ SVG ตามขั้นตอนต่อไปนี้:
- ตั้งค่าเนมสเปซ SVG และโหลดไฟล์อินพุต
- สร้างองค์ประกอบสี่เหลี่ยมผืนผ้าและตั้งค่าคุณสมบัติต่างๆ
- เพิ่มองค์ประกอบสี่เหลี่ยมผืนผ้าเป็นลูกคนแรกและบันทึกไฟล์ที่ส่งออก
ข้อมูลโค้ดด้านล่างสาธิตวิธีตั้งค่าสีพื้นหลังของภาพ SVG โดยทางโปรแกรมใน C#:
// ตั้งค่า SVG เนมสเปซ URL
string SvgNamespace = "http://www.w3.org/2000/svg";
// โหลดเอกสาร SVG จากไฟล์
SVGDocument document = new SVGDocument("basic-shapes.svg");
// รับรูทองค์ประกอบ svg ของเอกสาร
SVGSVGElement svgElement = document.RootElement;
// สร้างองค์ประกอบสี่เหลี่ยมผืนผ้าและตั้งค่าแอตทริบิวต์ "เติม" เพื่อเปลี่ยนสีพื้นหลัง
SVGRectElement rectElement = (SVGRectElement)document.CreateElementNS(SvgNamespace, "rect");
rectElement.X.BaseVal.Value = 3;
rectElement.Y.BaseVal.Value = 3;
rectElement.Width.BaseVal.Value = 400;
rectElement.Height.BaseVal.Value = 400;
rectElement.SetAttribute("fill", "Salmon");
// เพิ่มองค์ประกอบสี่เหลี่ยมผืนผ้าเป็นลูกคนแรกให้กับองค์ประกอบ SVG
svgElement.InsertBefore(rectElement, svgElement.FirstChild);
// บันทึกเอกสาร SVG
document.Save("background-color.svg");
รับใบอนุญาตการประเมินฟรี
คุณสามารถประเมิน API ได้โดยไม่มีข้อจำกัดในการประเมินโดยรับ ใบอนุญาตการประเมินฟรี
บทสรุป
ในบทความนี้ คุณได้เรียนรู้วิธีเปลี่ยนสีขององค์ประกอบต่างๆ ในภาพ SVG ในทำนองเดียวกัน รายละเอียดเกี่ยวกับการตั้งค่าสีพื้นหลังของภาพ SVG จะถูกกล่าวถึงที่นี่เช่นกัน นอกจากนี้ คุณสามารถดูคุณลักษณะอื่นๆ ของ API ได้ในส่วน เอกสารประกอบ ในกรณีที่มีข้อสงสัย โปรดเขียนถึงเราที่ ฟอรัม