> [Site index](https://perfectvector.com/llms.txt) — available pages and descriptions.

# Inkscape: Object to Path กับ Stroke to Path ต่างอย่างไร

> เทียบ Object to Path และ Stroke to Path ใน Inkscape บนวงกลมเดียวกัน ดูคำสั่งที่คงเส้นปรับได้ คำสั่งที่สร้างแถบเติมสี และสิ่งที่ต้องตรวจต่อ

Source: https://perfectvector.com/th/blog/inkscape-stroke-vs-object-to-path

Language: th
Author: Irene Kim
Published: 2026-10-07T08:00:00+09:00
Updated: 2026-10-08T08:00:00+09:00

**Object to Path ของ Inkscape แปลงรูปทรงหรือข้อความเป็นรูปทรงพาธ ส่วน Stroke to Path แปลงเส้นที่มองเห็นเป็นรูปทรงเติมสี** สำหรับวงกลมไม่มีสีเติมและมีเส้นหนา Object to Path ยังคงให้แก้เส้นในฐานะเส้น ส่วน Stroke to Path ทำให้วงแหวนเองกลายเป็นรูปเติมสี

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

การเปรียบเทียบนี้ใช้พฤติกรรมคำสั่งตามเอกสารของ Inkscape และตัวอย่าง SVG ต้นฉบับขนาดเล็ก โค้ดและการตรวจเรนเดอร์ด้านล่างสาธิตรูปแบบข้อมูลสองแบบ ไม่ใช่ไฟล์ที่ส่งออกจากคำสั่งจริงใน Inkscape

## เปรียบเทียบคำสั่งบนวงกลมที่มีเส้นเดียวกัน

เริ่มจากวงกลมที่ **ไม่มีสีเติม มีเส้นสีเขียวอมฟ้า และเส้นกว้าง 24 หน่วย** เก็บสำเนาหลักและทำสำเนาแยกสำหรับแต่ละการแปลง เพื่อไม่ให้ผลของคำสั่งหนึ่งกลายเป็นอินพุตของอีกคำสั่ง

เส้นจะระบายเป็นแถบตามขอบรูปทรงหรือพาธ เส้นกลางคือเส้นเรขาคณิตที่แถบถูกวาดล้อมรอบ ส่วนสีเติมระบายบริเวณที่รูปทรงล้อมไว้ตามกฎการเติม

สำหรับวงกลมเรียบง่ายนี้ ความแตกต่างคือ:

| คำถาม                                               | Object to Path             | Stroke to Path               |
| --------------------------------------------------- | -------------------------- | ---------------------------- |
| อะไรกลายเป็นรูปทรงพาธ?                              | เส้นขอบทางเรขาคณิตของวงกลม | แถบเส้นที่มองเห็น            |
| หลังจากนั้นสีมาจากไหน?                              | เส้นที่ยังปรับค่าได้บนพาธ  | สีเติมในแถบที่แปลงแล้ว       |
| ยังขยายแถบเดิมด้วยตัวควบคุมความกว้างเส้นได้หรือไม่? | ได้                        | ไม่ได้ แถบกลายเป็นรูปทรงแล้ว |
| ใช้โหนดแก้อะไร?                                     | พาธที่มีเส้นอยู่           | ขอบเขตที่ล้อมแถบเติมสี       |
| ตัวควบคุมเดิมใดหายไป?                               | จุดจับพิเศษของรูปวงกลม     | ตัวควบคุมเส้นเดิมของแถบ      |

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

![ทางเลือกเชิงแนวคิดจากวงกลมเดียว: เส้นกลางของเส้นที่ยังปรับค่าได้ และขอบด้านในกับด้านนอกของแถบเติมสี](https://perfectvector.com/blog/inkscape-stroke-vs-object-to-path/path-representations.webp)

*ภาพแนวคิดของสองรูปแบบ: เส้นกลางของเส้นที่ยังปรับค่าได้ และขอบด้านในกับด้านนอกของแถบเติมสี ภาพนี้ไม่ใช่ภาพหน้าจอ Inkscape หรือผลวัดจากคำสั่ง*

## Object to Path เปลี่ยนรูปแบบข้อมูลของรูปทรง

[คู่มือแปลงรูปทรงเป็นพาธของ Inkscape](https://inkscape-manuals.readthedocs.io/en/latest/objects-to-paths.html) แยกรูปทรงเรขาคณิตที่มีตัวควบคุมออกจากพาธที่แก้ด้วยโหนด วงกลมเริ่มด้วยตัวควบคุมเฉพาะรูป ใช้ **Path → Object to Path** เมื่อต้องการเปลี่ยนรูปทรงผ่านโหนดพาธแทน

การแปลงวงกลมเป็นพาธไม่ได้ทำให้ความหนาเส้นกลายเป็นรูปทรงเติมสีโดยตัวมันเอง พาธยังมีทั้งสีเติมและเส้นได้ ในกรณีไม่มีสีเติมของเรา แถบเขียวอมฟ้ายังคงเป็นเส้นที่ปรับค่าได้บนพาธวงกลม

Object to Path จึงเหมาะเมื่อต้องเปลี่ยนบางส่วนของวงกลมและยังปรับความกว้างเส้นได้ แต่มีประโยชน์น้อยกว่าหากต้องการแค่วงกลมใหญ่ขึ้นหรือเส้นกว้างต่างไป เพราะรูปทรงเดิมมีตัวควบคุมเหล่านี้อยู่แล้ว

การแปลงยังทำให้เสียตัวควบคุมพิเศษของรูปเดิม [บทเรียนขั้นสูง](https://inkscape.org/doc/tutorials/advanced/tutorial-advanced.html) ของ Inkscape อธิบายว่ารูปลักษณ์คงอยู่ แต่ความสามารถที่ผูกกับชนิดอ็อบเจ็กต์เดิมหายไป เก็บวงกลมหลักไว้หากจะกลับมาปรับในฐานะวงกลมภายหลัง

สำหรับข้อความ ข้อแลกเปลี่ยนเดียวกันส่งผลต่อการแก้ไข: รูปทรงตัวอักษรที่แปลงแล้วแก้เป็นพาธได้ ส่วนข้อความต้นฉบับที่แก้ได้ควรอยู่ในไฟล์หลักแยก การแปลงตัวอักษรเป็นคนละความต้องการกับการทำเส้นให้เป็นรูปทรงขอบ

## Stroke to Path ทำให้แถบที่ระบายกลายเป็นรูปทรง

ใช้ **Path → Stroke to Path** เมื่อต้องการให้พื้นที่เส้นที่มองเห็นกลายเป็นรูปทรงพาธเติมสี บทเรียนขั้นสูงของ Inkscape อธิบายด้วยพาธไม่มีสีเติมแต่มีเส้น ผลที่แปลงมีสีเติมและไม่มีเส้น

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

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

คุณเพิ่มเส้นใหม่ให้ผลที่แปลงแล้วได้ เพราะพาธยังมีเส้นได้ การทำเช่นนั้นเพิ่มสีรอบรูปทรงใหม่ ไม่ได้คืนรูปแบบเส้นที่ปรับค่าได้ของวงกลมเดิม ข้อนี้สำคัญเมื่อรูปขอบหนาขึ้นโดยไม่คาดหลังใส่เส้นอีกครั้ง

สำหรับเส้นเปิด รูปขอบที่เห็นยังขึ้นกับปลายเส้นและรอยต่อ [คู่มือเส้นของ Inkscape](https://inkscape-manuals.readthedocs.io/en/latest/strokes.html) อธิบายสิ่งเหล่านี้เป็นการตั้งค่าเส้น ตรวจผลจริงเมื่ออินพุตใช้คุณสมบัตินี้ แทนการคิดว่าจะเหมือนวงกลมไม่มีเส้นประทุกอย่าง

## ดูความแตกต่างในตัวอย่าง SVG ต้นฉบับ

สามไฟล์ด้านล่างอธิบายวงแหวนเดียวกันที่ต้องการบนพื้นที่วาด 256 × 256 เป็นภาพ SVG ต้นฉบับที่เขียนเพื่อเปรียบเทียบ ไม่ใช่ XML ที่คัดลอกจากคำสั่งใดใน Inkscape

บันทึกแต่ละบล็อกตามชื่อไฟล์ เปิดในโปรแกรมดูหรือแก้ไขที่รองรับ SVG แล้วเปรียบเทียบทั้งซอร์สและรูปลักษณ์

**1. รูปทรงอินพุต `shape.svg`:**

```xml
<svg xmlns="http://www.w3.org/2000/svg"
     width="256" height="256" viewBox="0 0 256 256">
  <circle cx="128" cy="128" r="72"
          fill="none" stroke="#0d9488" stroke-width="24"/>
</svg>
```

**2. พาธที่มีเส้นปรับค่าได้ `center-path.svg`:**

```xml
<svg xmlns="http://www.w3.org/2000/svg"
     width="256" height="256" viewBox="0 0 256 256">
  <path d="M 128 56 A 72 72 0 1 1 128 200
           A 72 72 0 1 1 128 56 Z"
        fill="none" stroke="#0d9488" stroke-width="24"/>
</svg>
```

องค์ประกอบเปลี่ยนจาก `circle` เป็น `path` แต่ `stroke` และ `stroke-width` ยังอยู่ พาธอธิบายเส้นกลาง ส่วนเส้นระบายความหนา

**3. แถบเติมสี `filled-band.svg`:**

```xml
<svg xmlns="http://www.w3.org/2000/svg"
     width="256" height="256" viewBox="0 0 256 256">
  <path d="M 128 44 A 84 84 0 1 1 128 212
           A 84 84 0 1 1 128 44 Z
           M 128 68 A 60 60 0 1 1 128 188
           A 60 60 0 1 1 128 68 Z"
        fill="#0d9488" fill-rule="evenodd"/>
</svg>
```

แถบมีรัศมีนอกและใน 84 และ 60 หน่วย ตรงกับรัศมี 72 หน่วยบวกหรือลบครึ่งหนึ่งของความกว้างเส้น 24 หน่วย กฎเติม evenodd ทำให้ตรงกลางไม่ถูกระบาย ไฟล์นี้มีสีเติมและไม่มีเส้นที่ปรับค่าได้

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

จากนั้นเราเปลี่ยนเฉพาะ `stroke-width="24"` เป็น `stroke-width="40"` ในสำเนาไฟล์พาธที่มีเส้นปรับค่าได้ แถบขยายออก จุด `128,40` ที่เคยว่างถูกระบาย ส่วนไฟล์แถบเติมสีที่ไม่ได้เปลี่ยนยังว่างตรงนั้น

นี่คือวิธีตรวจที่มีประโยชน์: ระบุว่าสิ่งใดกำหนดความกว้าง แล้วเปลี่ยนคุณสมบัตินั้นอย่างตั้งใจ เราไม่ได้เรียกคำสั่งจริงของ Inkscape ในตัวอย่างนี้ และภาพเรนเดอร์เหล่านี้ไม่ได้ยืนยันจำนวนโหนด การจัดกลุ่ม หรือพฤติกรรมส่งออกของโปรแกรมจริง

## เลือกรูปแบบที่ขั้นตอนถัดไปต้องการ

ใช้เป้าหมายการแก้ครั้งต่อไปเลือกคำสั่ง:

| เป้าหมาย                                    | ทางเลือกที่เหมาะ            | สิ่งที่ตรวจหลังทำ                                   |
| ------------------------------------------- | --------------------------- | --------------------------------------------------- |
| เปลี่ยนรูปวงกลมด้วยโหนดพาธแต่ละจุด          | Object to Path              | รูปทรงกลายเป็นพาธและเส้นที่ต้องการยังอยู่           |
| ปรับความกว้าง เส้นประ ปลาย หรือรอยต่อได้ต่อ | เก็บเส้นที่ปรับค่าได้       | ตัวควบคุมยังจัดการแถบที่กำลังแก้                    |
| ทำแถบที่มองเห็นเป็นส่วนของรูปเงาเติมสี      | Stroke to Path              | แถบเดิมเป็นรูปทรงเติมสีและช่องเปิดที่ต้องการยังอยู่ |
| เก็บเส้นสำหรับกระบวนการตามพาธกลาง           | รักษาพาธที่มีเส้นปรับค่าได้ | แอปถัดไปใช้พาธตามต้องการ                            |

รูปขอบเติมสีและเส้นกลางเป็นอินพุตต่างกันสำหรับตัดหรือพล็อต โปรแกรมปลายทางที่ตามขอบพาธอาจตีความขอบในและขอบนอกของวงแหวนเติมสีต่างจากเส้นกลางเส้นเดียว การทำเส้นเป็นรูปขอบจึงเป็นทางเลือกรูปทรง ไม่ใช่การรับประกันว่าเครื่องจะวิ่งครั้งเดียว ใช้[การตรวจการตัดเส้นซ้ำ](https://perfectvector.com/th/blog/svg-cutting-double-lines) เมื่อการนำเข้าจริงทำให้มีรอบเพิ่ม

เช่นเดียวกัน การแปลงเป็นรูปขอบอาจช่วยเมื่อแอปรับงานจัดการเส้นต่างออกไป แต่ไม่ได้วิเคราะห์ปัญหาเส้นหายทุกแบบ ใช้[คู่มือวิเคราะห์การส่งออกเส้น SVG](https://perfectvector.com/th/blog/svg-strokes-disappear) เมื่อเส้นหายหลังส่งออก

## ทั้งสองคำสั่งไม่ได้ลากเส้นจากพิกเซลเป็นพาธ

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

หากสิ่งที่เลือกเป็นภาพ ให้ตัดสินใจว่าต้องการรูปทรงเวกเตอร์จริงหรือไม่ สำหรับวิธีลากเส้นในเครื่อง ใช้[กระบวนการ Inkscape Trace Bitmap](https://perfectvector.com/th/blog/inkscape-trace-bitmap) แยกต่างหาก หาก SVG ยังทำตัวเหมือนอ็อบเจ็กต์เดียวที่เลือก ให้ตรวจ[กลุ่ม พาธประกอบ และภาพฝัง](https://perfectvector.com/th/blog/svg-wont-ungroup) ก่อน แทนการแปลงซ้ำ

เมื่อมีต้นทางเป็นโลโก้ราสเตอร์เรียบง่ายเท่านั้นและต้องการพาธเติมสีที่แก้ไขได้ [เครื่องมือแปลงภาพเป็นเวกเตอร์ของ PerfectVector](https://perfectvector.com/th/image-to-vector) เป็นอีกจุดเริ่มต้น ตรวจภาพตัวอย่างราสเตอร์ที่มีการป้องกัน แล้วปลดล็อกก่อนแก้และส่งออก SVG จริง ตรวจพาธที่ได้ในโปรแกรมแก้ไขก่อนเลือกคำสั่งพาธ รูปเงาที่ลากเส้นตามไม่ได้กู้เส้นกลางเดิมของภาพวาด

## ตรวจอ็อบเจ็กต์ที่เลือกก่อนแปลงซ้ำ

เก็บไฟล์หลักที่แก้ได้ ทำงานบนสำเนา และตรวจสามเรื่องในเอกสาร Inkscape ของคุณ:

1. **ชนิดอ็อบเจ็กต์:** สิ่งที่เลือกเป็นรูปทรงที่มีตัวควบคุม ข้อความ พาธธรรมดา กลุ่ม หรือภาพฝัง?
2. **การระบาย:** แถบที่เห็นมาจากเส้นหรือสีเติม?
3. **เป้าหมายแก้ไข:** ต้องย้ายเส้นกลาง เปลี่ยนความกว้าง หรือเปลี่ยนขอบเขตพื้นที่เติมสี?

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

สำหรับปัญหาอื่นนอกเหนือจากการเลือกคำสั่ง ดู[คู่มือแก้ปัญหา SVG](https://perfectvector.com/blog/topics/svg-troubleshooting)

## คำถามที่พบบ่อย

**Object to Path แปลงเส้นเป็นรูปขอบด้วยหรือไม่?**

ไม่ Object to Path แปลงรูปทรงหรือข้อความเป็นรูปทรงพาธ พาธที่ได้อาจคงเส้นที่ปรับค่าได้ ใช้ Stroke to Path เมื่อต้องการให้แถบเส้นที่ระบายกลายเป็นรูปทรงเติมสี

**เปลี่ยนความกว้างหลัง Stroke to Path ได้หรือไม่?**

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

**พาธยังเป็นอ็อบเจ็กต์ใน Inkscape หรือไม่?**

ใช่ พาธเป็นอ็อบเจ็กต์ชนิดหนึ่ง Object to Path เปลี่ยนอ็อบเจ็กต์ที่รองรับและไม่ใช่พาธให้เป็นรูปทรงพาธ ไม่ใช่คำสั่งทำให้อ็อบเจ็กต์เลิกเป็นอ็อบเจ็กต์

**มีคำสั่งใดแปลง PNG เป็นพาธแก้ไขได้หรือไม่?**

ไม่มี การลากเส้นราสเตอร์เป็นเวกเตอร์เป็นอีกกระบวนการ สร้างหรือกู้รูปทรงเวกเตอร์ก่อน แล้วตรวจว่ามีรูปทรง เส้นที่ปรับค่าได้ หรือพาธเติมสี ก่อนเลือกคำสั่งแปลง

## แหล่งข้อมูล

1. [บทเรียนขั้นสูงของ Inkscape](https://inkscape.org/doc/tutorials/advanced/tutorial-advanced.html) — อธิบายพาธ การแปลงรูปทรงและข้อความ และการแปลงเส้นไม่มีสีเติมเป็นรูปขอบเติมสี
2. [แก้โหนดบนรูปทรงเรขาคณิต คู่มือ Inkscape](https://inkscape-manuals.readthedocs.io/en/latest/objects-to-paths.html) — แยกตัวควบคุมเฉพาะรูปจากโหนดพาธและอธิบาย Object to Path
3. [เส้น คู่มือ Inkscape](https://inkscape-manuals.readthedocs.io/en/latest/strokes.html) — อธิบายความกว้างเส้นที่ปรับค่าได้ ปลาย รอยต่อ เส้นประ และการระบาย
4. [ข้อกำหนดการระบาย SVG 2](https://www.w3.org/TR/SVG2/painting.html) — นิยามกฎเติมและการระบายเส้นที่ใช้ในตัวอย่าง SVG ต้นฉบับ

***

มีเพียง PNG หรือ JPG และต้องการรูปทรงเวกเตอร์ก่อนหรือไม่? [แปลงภาพด้วย PerfectVector](https://perfectvector.com/th/image-to-vector) ตรวจภาพตัวอย่างที่มีการป้องกัน แล้วปลดล็อกผลลัพธ์เพื่อแก้และส่งออก SVG หากมีงานเวกเตอร์ที่แก้ไขได้อยู่แล้ว ให้ทำต่อจากไฟล์หลักนั้นและเลือกคำสั่งให้ตรงรูปทรงที่ต้องการ

## Explore

- [Read the HTML article](https://perfectvector.com/th/blog/inkscape-stroke-vs-object-to-path)
- [แอนิเมชันเส้นขอบ SVG: เตรียมเส้นทางวาดเส้นเดียว](https://perfectvector.com/th/blog/svg-stroke-animation.md)
- [SVG feComposite: เทียบภาพด้วย in, out และ xor](https://perfectvector.com/th/blog/svg-composite-artwork.md)
- [Product facts](https://perfectvector.com/product-facts.md)
- [FAQ](https://perfectvector.com/faq.md)
- [Pricing and credits](https://perfectvector.com/pricing.md)