PerfectVector
Oleh Irene Kim

Inkscape Object to Path vs Stroke to Path: Apa Bedanya?

Bandingkan Object to Path dan Stroke to Path Inkscape pada lingkaran yang sama. Pelajari mana yang mempertahankan stroke aktif dan mana yang membuat pita berisi.

10 menit baca
Di halaman ini

Object to Path Inkscape mengubah bentuk atau teks menjadi geometri path. Stroke to Path mengubah stroke yang terlihat menjadi geometri berisi. Pada lingkaran tanpa fill dengan stroke tebal, Object to Path mempertahankan stroke agar tetap dapat diedit sebagai stroke; Stroke to Path menjadikan cincin itu sendiri bentuk berisi.

Pilih di antara keduanya dengan menentukan apa yang perlu Anda edit: garis yang membawa stroke, atau batas pita berwarna. Tangkapan layar cincin dapat terlihat serupa dalam kedua kasus, sehingga tampilan saja bukan pemeriksaan yang baik.

Perbandingan ini memakai perilaku perintah yang didokumentasikan Inkscape dan contoh SVG sederhana buatan sendiri. Kode serta pemeriksaan render di bawah menunjukkan kedua representasi; keduanya bukan ekspor asli Inkscape.

Bandingkan perintah pada satu lingkaran dengan stroke

Mulailah dengan lingkaran tanpa fill, dengan stroke hijau kebiruan selebar 24 unit. Simpan salinan master dan buat salinan terpisah untuk setiap konversi agar hasil satu perintah tidak menjadi masukan perintah lainnya.

Stroke melukis pita sepanjang garis luar bentuk atau path. Garis tengahnya adalah garis geometris yang menjadi pusat pita tersebut. Fill melukis area yang dilingkupi geometri sesuai aturan fill-nya.

Untuk lingkaran sederhana ini, perbedaannya adalah:

PertanyaanObject to PathStroke to Path
Apa yang menjadi geometri path?Garis luar geometris lingkaranPita stroke yang terlihat
Dari mana warna berasal setelahnya?Stroke aktif pada pathFill pada pita hasil konversi
Apakah pita yang ada masih dapat diperlebar dengan kontrol lebar stroke aktifnya?YaTidak; pita itu kini berupa geometri
Apa yang Anda edit dengan node?Path yang membawa strokeBatas yang mengelilingi pita berisi
Kontrol pengeditan asli apa yang hilang?Handle bentuk khusus lingkaranKontrol stroke aktif asli pita

Tabel ini sengaja hanya membahas satu lingkaran tanpa fill dan tanpa garis putus-putus. Teks, seleksi dengan fill sekaligus stroke, marker, efek, dan grup yang ditransformasikan memerlukan pemeriksaan tersendiri. Jangan menyimpulkan jumlah node atau objek yang tetap dari contoh ini.

Alternatif konseptual dari satu lingkaran: garis tengah stroke aktif serta batas dalam dan luar pita berisi
Ilustrasi konseptual dua representasi: garis tengah stroke aktif serta batas dalam dan luar pita berisi. Gambar ini bukan tangkapan layar Inkscape atau pengukuran hasil perintah.

Object to Path mengubah representasi bentuk

Manual bentuk-ke-path Inkscape membedakan bentuk geometris aktif dari path yang diedit dengan node. Lingkaran bermula dengan kontrol khusus bentuk. Gunakan Path → Object to Path saat Anda perlu mengubah geometrinya melalui node path.

Mengubah lingkaran menjadi path tidak dengan sendirinya menjadikan ketebalan stroke sebagai geometri berisi. Path tetap dapat memiliki fill dan stroke. Dalam kasus tanpa fill ini, pita hijau kebiruan tetap menjadi stroke aktif pada path melingkar.

Karena itu, Object to Path berguna ketika Anda ingin mengubah sebagian bentuk lingkaran sambil mempertahankan lebar stroke yang dapat diatur. Perintah ini kurang berguna jika Anda hanya menginginkan lingkaran lebih besar atau lebar berbeda; bentuk asli sudah memiliki kontrol untuk perubahan tersebut.

Konversi juga menghilangkan kontrol khusus bentuk aslinya. Tutorial Lanjutan Inkscape menjelaskan bahwa tampilan dipertahankan sementara kemampuan yang terkait jenis objek asli hilang. Simpan master lingkaran jika Anda mungkin ingin mengeditnya sebagai lingkaran lagi.

Untuk teks, kompromi yang sama memengaruhi pengeditan: geometri huruf yang dikonversi dapat diedit sebagai path, sedangkan teks asli yang dapat diedit sebaiknya tetap disimpan dalam master terpisah. Mengonversi teks berbeda kebutuhannya dari mengubah stroke menjadi outline.

Stroke to Path menjadikan pita berwarna sebagai geometri

Gunakan Path → Stroke to Path saat Anda ingin area stroke yang terlihat menjadi geometri path berisi. Tutorial Lanjutan Inkscape menjelaskannya dengan path tanpa fill dan dengan stroke: hasil konversinya memiliki fill tanpa stroke.

Untuk lingkaran contoh, bayangkan dua batas: bagian luar cincin dan bagian dalam bukaannya. Bersama-sama keduanya mengelilingi area hijau kebiruan yang sebelumnya dilukis oleh stroke aktif.

Stroke yang diubah menjadi outline adalah path berisi yang mewakili area terlihat dari stroke sebelumnya. Setelah di-outline, ketebalan aslinya menjadi bagian dari geometri tersebut. Mengubahnya berarti mengedit batas atau menerapkan operasi geometris yang sesuai, bukan mengatur lebar stroke aktif sebelumnya.

Anda dapat menambahkan stroke baru ke hasil outline karena path tetap dapat memiliki stroke. Ini menambahkan warna di sekeliling geometri baru; tindakan itu tidak mengembalikan representasi stroke aktif lingkaran asli. Perbedaan ini penting ketika outline tiba-tiba menjadi lebih tebal setelah diberi stroke lain.

Untuk garis terbuka, outline yang terlihat juga bergantung pada pilihan cap dan join. Manual stroke Inkscape menjelaskan keduanya sebagai pengaturan stroke. Periksa hasil sebenarnya saat masukan memakai fitur tersebut, alih-alih menganggap perilakunya persis seperti lingkaran tanpa garis putus-putus.

Lihat perbedaannya dalam contoh SVG buatan sendiri

Tiga berkas berikut menggambarkan cincin yang sama dalam area gambar 256 × 256. Semuanya merupakan ilustrasi SVG orisinal untuk perbandingan ini, bukan XML yang disalin dari salah satu perintah Inkscape.

Simpan setiap blok sesuai nama berkasnya. Buka dalam penampil atau editor yang mendukung SVG dan bandingkan sumber serta tampilannya.

1. Bentuk masukan, shape.svg:

<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. Path yang membawa stroke aktif, center-path.svg:

<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>

Elemen berubah dari circle menjadi path, tetapi stroke dan stroke-width tetap ada. Path menjelaskan garis tengah; stroke melukis ketebalannya.

3. Pita berisi, filled-band.svg:

<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>

Pita memiliki radius luar dan dalam 84 serta 60 unit, sesuai radius 72 unit ditambah atau dikurangi setengah lebar stroke 24 unit. Aturan fill evenodd membiarkan bagian tengah tidak terisi. Berkas ini memiliki fill tanpa stroke aktif.

Kami menyimpan dan membuka kembali berkas-berkas tersebut, memeriksa atributnya, lalu merendernya dengan Sharp dan librsvg. Ketiga render dasar memiliki bagian tengah kosong dan warna hijau kebiruan pada titik sampel cincin yang sama. Piksel batas yang dihaluskan tidak identik, jadi ini demonstrasi representasi, bukan perbandingan ekspor piksel demi piksel.

Kemudian kami hanya mengubah stroke-width="24" menjadi stroke-width="40" pada salinan berkas path aktif. Pita aktif melebar: titik yang semula kosong di 128,40 menjadi terisi. Berkas pita berisi yang tidak diubah tetap kosong di sana.

Itulah pemeriksaan yang berguna: kenali apa yang mengendalikan lebar, lalu ubah properti itu dengan sengaja. Perintah asli Inkscape tidak dijalankan untuk contoh ini, dan render tersebut tidak menetapkan jumlah node, pengelompokan, atau perilaku ekspor editor asli.

Pilih representasi yang dibutuhkan langkah berikutnya

Gunakan tujuan pengeditan berikutnya untuk memilih perintah:

Tujuan AndaPilihan yang sesuaiPeriksa setelahnya
Mengubah bentuk lingkaran melalui node path individualObject to PathBentuk menjadi path dan stroke aktif yang diinginkan tetap ada
Tetap mengatur lebar garis, garis putus-putus, cap, atau joinPertahankan stroke aktifKontrol tersebut tetap mengatur pita yang Anda ubah
Menjadikan pita terlihat sebagai bagian siluet berisiStroke to PathPita sebelumnya menjadi geometri berisi, dengan bukaan yang diinginkan tetap ada
Mempertahankan garis untuk proses yang mengikuti path tengahPertahankan path aktifAplikasi berikutnya memakai path itu sesuai maksud

Outline berisi dan garis tengah adalah masukan berbeda untuk pemotongan atau plotting. Program lanjutan yang mengikuti batas path dapat menafsirkan kontur dalam dan luar cincin berisi secara berbeda dari satu garis tengah. Karena itu, membuat outline merupakan pilihan geometri, bukan jaminan mesin hanya melakukan satu lintasan. Gunakan pemeriksaan pemotongan garis ganda ketika impor sebenarnya menghasilkan lintasan tambahan.

Demikian pula, membuat outline dapat membantu jika aplikasi penerima menangani stroke secara berbeda, tetapi tidak mendiagnosis semua masalah garis hilang. Ikuti diagnosis ekspor stroke SVG ketika garis menghilang setelah ekspor.

Kedua perintah tidak menjiplak piksel menjadi path

PNG atau JPG adalah gambar raster yang tersusun dari piksel. Kedua perintah menu Path ini berkaitan dengan bentuk vektor, teks, path, dan stroke yang sudah ada. Keduanya bukan alur penjiplakan gambar.

Jika item terpilih berupa gambar, tentukan apakah Anda benar-benar membutuhkan geometri vektor. Untuk penjiplakan lokal, gunakan alur Inkscape Trace Bitmap yang terpisah. Jika SVG masih berperilaku seperti satu objek terpilih, periksa dahulu grup, path gabungan, dan gambar tertanam alih-alih terus mengonversinya.

Jika sumber Anda hanya logo raster sederhana dan Anda membutuhkan path berisi yang dapat diedit, alat gambar-ke-vektor PerfectVector merupakan titik awal lain. Periksa pratinjau raster yang dilindungi, lalu buka kunci hasil sebelum benar-benar mengedit dan mengekspor SVG. Periksa path hasilnya di editor sebelum memilih perintah path; siluet hasil penjiplakan tidak memulihkan garis tengah gambar asli.

Periksa objek terpilih sebelum mengonversinya lagi

Simpan master yang dapat diedit, kerjakan salinan, dan periksa tiga hal dalam dokumen Inkscape Anda:

  1. Jenis objek: apakah seleksi berupa bentuk aktif, teks, path biasa, grup, atau gambar tertanam?
  2. Warna: apakah pita terlihat berasal dari stroke atau fill?
  3. Tujuan pengeditan: apakah Anda perlu memindahkan garis tengah, mengubah lebarnya, atau mengubah batas area berisi?

Gunakan alat Node serta kontrol Fill and Stroke bersama-sama. Melihat node tidak membuktikan stroke sudah di-outline: path biasa tetap dapat membawa stroke aktif. Melihat pita berisi tidak membuktikan berkas siap untuk mesin potong atau printer.

Untuk masalah lain di luar pilihan perintah ini, jelajahi panduan pemecahan masalah SVG.

Tanya jawab

Apakah Object to Path juga mengubah stroke menjadi outline?

Tidak. Object to Path mengubah bentuk atau teks menjadi geometri path. Path hasilnya dapat mempertahankan stroke aktif. Gunakan Stroke to Path saat Anda ingin pita stroke berwarna menjadi geometri berisi.

Bisakah saya mengubah lebar setelah Stroke to Path?

Lebar stroke sebelumnya kini menjadi bagian geometri outline berisi. Edit batasnya atau gunakan operasi geometris yang sesuai. Menambahkan stroke baru melukis di sekeliling geometri tersebut; itu tidak mengembalikan stroke aktif asli.

Apakah path masih merupakan objek di Inkscape?

Ya. Path adalah salah satu jenis objek. Object to Path mengubah objek non-path yang didukung menjadi geometri path; perintah itu tidak membuat sebuah objek berhenti menjadi objek.

Apakah salah satu perintah dapat mengubah PNG menjadi path yang dapat diedit?

Tidak. Penjiplakan raster-ke-vektor adalah alur terpisah. Buat atau dapatkan geometri vektor terlebih dahulu, lalu periksa apakah geometri itu mengandung bentuk, stroke aktif, atau path berisi sebelum memilih perintah konversi.

Sumber

  1. Tutorial Lanjutan Inkscape — menjelaskan path, konversi bentuk dan teks, serta konversi stroke tanpa fill menjadi outline berisi.
  2. Mengedit Node pada Bentuk Geometris, manual Inkscape — membedakan kontrol khusus bentuk dari node path dan menjelaskan Object to Path.
  3. Stroke, manual Inkscape — menjelaskan lebar stroke aktif, cap, join, garis putus-putus, dan warna.
  4. Spesifikasi pewarnaan SVG 2 — mendefinisikan aturan fill dan pewarnaan stroke yang dipakai demonstrasi SVG buatan ini.

Hanya memiliki PNG atau JPG dan perlu geometri vektor terlebih dahulu? Konversikan gambar dengan PerfectVector, periksa pratinjau yang dilindungi, lalu buka kunci hasil untuk pengeditan dan ekspor SVG. Jika sudah memiliki desain vektor yang dapat diedit, lanjutkan dari master itu dan pilih perintah yang sesuai dengan geometri yang Anda butuhkan.

Lebih banyak dari blog

PerfectVector

Mulai dengan SVG yang lebih rapi
dan lebih mudah diedit

Tanpa kartu kredit