กราฟิก SVG เป็นส่วนหนึ่งของโครงการสมัยใหม่แทบทุกโครงการ ตั้งแต่อีกน icons และกราฟไปจนถึงรายงานและแดชบอร์ด แต่ถ้าคุณสามารถปรับสีของพวกมันได้โดยตรงจากโค้ด Python ของคุณล่ะ? แทนที่จะเปิดไฟล์แต่ละไฟล์ในเครื่องมือกราฟิก คุณสามารถทำให้กระบวนการนี้เป็นอัตโนมัติในไม่กี่บรรทัด ไม่ว่าคุณจะออกแบบแดชบอร์ด สร้างรายงาน หรือปรับแต่งไอคอนแอป เปลี่ยนสี SVG ด้วย Python สามารถช่วยคุณประหยัดเวลาได้มาก กับ Aspose.SVG for Python คุณสามารถโหลด SVG ได้อย่างง่ายดาย แก้ไขสีการเติมของมัน และบันทึกเวอร์ชันที่อัปเดตด้วยความแม่นยำและการควบคุม ในคู่มือนี้ เราจะแนะนำวิธีการเปลี่ยนสีการเติม SVG ใน Python

SVG Fill Color คืออะไร?

SVG (Scalable Vector Graphics) เป็นรูปแบบภาพที่ใช้ XML ซึ่งสามารถขยายได้โดยไม่สูญเสียคุณภาพ รูปทรงแต่ละรูป เช่น <circle> , <rect> หรือ <path> สามารถมีคุณสมบัติ fill ที่กำหนดสีภายในของมันได้

ตัวอย่างเช่น:

<rect width="100" height="50" fill="blue" />

การเปลี่ยน fill="blue" เป็น fill="red" จะทำให้สี่เหลี่ยมผืนผ้าเปลี่ยนเป็นสีแดงทันที

ง่ายสำหรับรูปร่างเดียว แต่ถ้าคุณกำลังทำงานกับ SVG หลายร้อยตัวหรือสร้างรายงานภาพโดยอัตโนมัติ การทำเช่นนี้ด้วยตนเองจะไม่สามารถปรับขนาดได้ นี่คือจุดที่การติดตั้งอัตโนมัติด้วย Python เข้ามาเกี่ยวข้อง

ทำไมต้องเปลี่ยนสีเติม SVG ใน Python?

มีกรณีจริงมากมายในการแก้ไขสีเติมของ SVG ด้วยโปรแกรม:

  • การสร้างภาพข้อมูลเชิงโต้ตอบ: ใช้พาเลทสีที่กำหนดเองกับกราฟหรือแดชบอร์ด
  • ความสอดคล้องของแบรนด์: ใช้สีกลุ่มแบรนด์โดยอัตโนมัติในกราฟิกที่สร้างขึ้น
  • ธีมสว่าง/มืด: เปลี่ยนสีไอคอน UI ให้ตรงกับธีมแอป
  • Automation: อัปเดตหลาย SVG โดยไม่ต้องเปิดเครื่องมือออกแบบ

แทนที่จะใช้ Inkscape หรือ Illustrator ให้ Python จัดการให้รวดเร็ว สม่ำเสมอ และอัตโนมัติเต็มที่

ด้วย Aspose.SVG for Python คุณสามารถประมวลผล แก้ไข และส่งออก SVGs ได้อย่างง่ายดายโดยไม่ต้องพึ่งพาซอฟต์แวร์ของบุคคลที่สาม

ติดตั้ง Aspose.SVG for Python

ติดตั้งไลบรารีจาก PyPI:

pip install aspose-svg-net

หมายเหตุ: คุณสามารถดาวน์โหลด Aspose.SVG for Python จาก releases.

จากนั้นนำเข้ามันเข้าสู่โปรเจ็กต์ของคุณ:

import aspose.svg as svg

เปลี่ยนสีเติม SVG ใน Python

เริ่มกันอย่างง่ายๆ เราจะโหลดไฟล์ SVG ที่มีอยู่ เปลี่ยนสีเติม และบันทึกเวอร์ชันที่อัปเดตแล้ว

ทำตามขั้นตอนด้านล่างเพื่อเปลี่ยนสีการเติมของ SVG:

  1. โหลดไฟล์ SVG ลงใน SVGDocument
  2. เข้าถึงองค์ประกอบราก.
  3. ค้นหาองค์ประกอบที่คุณต้องการเปลี่ยนสีใหม่
  4. ปรับปรุงแอตทริบิวต์ fill ของมัน
  5. บันทึกไฟล์ที่ปรับปรุงแล้ว

โค้ดตัวอย่างต่อไปนี้แสดงให้เห็นว่าคุณจะโหลดไฟล์ SVG ที่มีอยู่และเปลี่ยนสีเติมได้อย่างไร:

import aspose.svg as svg

# 1. โหลดเอกสาร SVG
document = svg.SVGDocument("sample.svg")

# 2. รับองค์ประกอบ SVG รากของเอกสาร
svgElement = document.root_element

# 3. ค้นหาองค์ประกอบวงกลมทั้งหมดในองค์ประกอบ g
circleNodes = svgElement.query_selector("circle")

# 4. รับองค์ประกอบวงกลมแรกและตั้งค่าคุณสมบัติการเติม
circleNodes.set_attribute("fill", "#0F0")          # bright green
circleNodes.set_attribute("fill-opacity", "0.3")   # 30% opacity

# 5. บันทึก SVG ที่อัปเดตแล้ว
document.save("sample_updated.svg")
เปลี่ยนสีเติม SVG ใน Python

เปลี่ยนสีเติมของ SVG ใน Python – ทีละขั้นตอน

Please find below the content of the circle element of sample.svg image.

  <!-- Circle element -->
  <circle cx="60" cy="75" r="30" fill="#FF6347" stroke="#000" stroke-width="2" />

นี่คือเนื้อหาที่อัปเดตขององค์ประกอบวงกลมในภาพ sampleupdated.svg

  <!-- Circle element -->
  <circle cx="60" cy="75" r="30" fill="#0F0" stroke="#000" stroke-width="2" fill-opacity="0.3"/>

เติมเส้นทาง SVG ด้วย Python

คุณยังสามารถแก้ไข <path> องค์ประกอบเฉพาะ ซึ่งมีประโยชน์สำหรับไอคอนหรือรูปทรงเวกเตอร์

ในการตั้งค่าสีกลิ่นขององค์ประกอบ <path> ใน SVG ที่มีอยู่ ให้ทำตามขั้นตอนเหล่านี้:

  1. โหลด SVG ด้วย SVGDocument
  2. เข้าถึงองค์ประกอบราก.
  3. เลือก <path> เป้าหมายโดยใช้ query_selector()
  4. ตั้งค่า fill (และ fill-opacity ที่เลือกได้)
  5. Save the result.

ด้านล่างเป็นโค้ดที่แสดงวิธีการเติมองค์ประกอบเส้นทางในภาษาไพธอน

import aspose.svg as svg

# 1. โหลดเอกสาร SVG
document = svg.SVGDocument("simple-path.svg")

# 2. รับเอกสาร SVG รากของเอกสาร
svgElement = document.root_element

# 3. หาส่วนประกอบวงกลมทั้งหมดในองค์ประกอบ g
circle_element = svgElement.query_selector("path:nth-child(1)")

# 4. รับองค์ประกอบวงกลมแรกและตั้งค่าคุณสมบัติการเติม
circle_element.set_attribute("fill", "#0F0")  # bright green
circle_element.set_attribute("fill-opacity", "0.3")  # 30% opacity

# 5. บันทึก SVG ที่ปรับปรุงแล้ว
document.save("simple-path-updated.svg")
เติมเส้นทาง SVG โดยใช้ Python

Fill an SVG Path using Python.

โปรดดูเนื้อหาของภาพ Sample-Path.svg ด้านล่างนี้

<svg height="400" width="800" xmlns="http://www.w3.org/2000/svg">
	<g stroke="black">
		<path d="M 10 100 Q 25 10 180 100 T 250 100 T 300 100 T 390 130" stroke="red" stroke-width="3" fill="none" />
    </g>
</svg>

Please find below the content of the simple-path-updated.svg image.

<svg height="400" width="800" xmlns="http://www.w3.org/2000/svg">
	<g stroke="black">
		<path d="M 10 100 Q 25 10 180 100 T 250 100 T 300 100 T 390 130" stroke="red" stroke-width="3" fill="#0F0" fill-opacity="0.3"/>
    </g>
</svg>

ใช้ SVG Fill ผ่านแอตทริบิวต์สไตล์

คุณสามารถตั้งค่าสีเติมของ SVG โดยใช้แอตทริบิวต์สไตล์ เช่นเดียวกับ CSS แบบอินไลน์ ทำตามขั้นตอนเหล่านี้:

  1. โหลด SVG ด้วย SVGDocument(path)
  2. เข้าถึงองค์ประกอบราก.
  3. ใช้ query_selector() เพื่อเลือกองค์ประกอบ.
  4. อัปเดต style ของมันด้วย set_attribute()
  5. บันทึก SVG ที่แก้ไขแล้ว。

ตัวอย่างรหัสต่อไปนี้แสดงวิธีการเปลี่ยนสีฟิล SVG โดยใช้แอตทริบิวต์สไตล์:

import aspose.svg as svg

# 1. โหลด SVG ที่มีอยู่แล้ว
document = svg.SVGDocument("sample.svg")

# 2. องค์ประกอบหลัก
root = document.root_element

# 3. เลือกองค์ประกอบที่คุณต้องการสี (เลือกเซเล็กเตอร์หนึ่งตัว)
target = root.query_selector("circle")  # or "path", ".some-class", "#myPath"

# 4. ใช้สีพื้นหลังด้วยแอตทริบิวต์สไตล์
target.set_attribute("style", "fill:blue")

# 5. บันทึกผลลัพธ์
document.save("ApplyStyle.svg")
ใช้การเติม SVG โดยใช้คุณสมบัติสไตล์ใน Python

ใช้การเติม SVG โดยใช้แอตทริบิวต์สไตล์ใน Python

  <!-- Circle element -->
  <circle cx="60" cy="75" r="30" fill="#FF6347" stroke="#000" stroke-width="2" style="fill: blue;"/>

รับใบอนุญาต Aspose ฟรี

เพื่อปลดล็อกฟังก์ชันการใช้งานทั้งหมดและลบข้อจำกัดในการประเมินผล ให้ขอ free temporary license จาก Aspose มันให้คุณทดสอบฟีเจอร์ทุกอย่างได้โดยไม่มีข้อจำกัด

แหล่งเรียนรู้ฟรี

นี่คือแหล่งข้อมูลบางประการที่จะช่วยให้คุณสำรวจเพิ่มเติม:

สีเติม SVG : คำถามที่พบบ่อย

Q: Aspose.SVG สามารถจัดการกับการไล่สีหรือการเติมความทึบได้หรือไม่?

A: ใช่ มันรองรับการไล่สี ความโปร่งใส และลวดลายเติม ซึ่งสามารถเข้าถึงได้ผ่านการปรับแต่งแอตทริบิวต์

Q: ถ้า SVG ของฉันใช้ CSS สำหรับสีจะทำอย่างไร?

A: คุณสามารถแก้ไขคุณสมบัติ style หรือแก้ไขกฎ ภายในโดยตรงได้

Q: ฉันสามารถส่งออก SVG ที่แก้ไขแล้วไปเป็นรูปแบบอื่น ๆ เช่น PNG หรือ PDF ได้หรือไม่?

A: อย่างแน่นอน Aspose.SVG สามารถแปลง SVG เป็นรูปแบบ PNG, JPG, BMP หรือ PDF ได้

Q: ขึ้นอยู่กับซอฟต์แวร์ภายนอกหรือไม่?

A: ไม่. Aspose.SVG ทำงานอย่างอิสระ ไม่จำเป็นต้องใช้ Inkscape, Illustrator หรือเครื่องมืออื่น ๆ.

บทสรุป

ในบทความนี้ คุณได้เรียนรู้วิธีการเปลี่ยนสีเติม SVG ใน Python โดยใช้ Aspose.SVG for Python ซึ่งให้การควบคุมเต็มรูปแบบตั้งแต่การโหลดและแก้ไของค์ประกอบไปจนถึงการบันทึกและแม้กระทั่งการส่งออกผลลัพธ์ของคุณเป็น PNG

วิธีการนี้ให้คุณควบคุมทั้งหมดในการ:

  • เปลี่ยนสีไอคอนและกราฟ
  • Automate theming
  • อัปเดตทรัพย์สินเวกเตอร์แบบไดนามิก

ด้วย Aspose.SVG โค้ดของคุณจะกลายเป็นผู้ช่วยด้านการออกแบบที่ช่วยจัดการการแก้ไขซ้ำอย่างแม่นยำและง่ายดาย

Need help? Visit our free support forum for direct assistance from the developers.

ดูเพิ่มเติม