PerfectVector
Oleh Irene Kim

Garis SVG Putus-putus untuk Laser: Periksa Path-nya

Diagnosis garis SVG putus-putus yang menjadi utuh dalam pratinjau laser. Bandingkan warna stroke, garis tengah terpisah, dan outline sebelum menyiapkan berkas.

9 menit baca
Di halaman ini

Jika SVG terlihat putus-putus di editor tetapi menjadi garis utuh dalam pratinjau laser, periksa path yang tersimpan. Pengaturan garis putus-putus dapat melukis celah sepanjang satu path kontinu tanpa menghilangkan geometri. Jika celah harus ada dalam berkas tersimpan, buat segmen garis tengah terpisah. Jika Anda mengendalikan pekerjaan di LightBurn, Perforation Mode yang didokumentasikan menawarkan cara lain: pertahankan path kontinu dan tentukan jarak potong serta lewati di sana.

Panduan ini membantu Anda mendiagnosis dan menyiapkan SVG itu sendiri. Contoh orisinal di bawah telah disimpan, diperiksa, dan dirender di browser. Contoh tersebut menunjukkan geometri berkas; bukan bukti keberhasilan impor dalam aplikasi laser atau pemotongan fisik. Simpan master yang tidak diubah, gunakan editor yang menampilkan titik ujung path, dan siapkan pratinjau aplikasi tujuan untuk pemeriksaan akhir.

Stroke putus-putus masih bisa berupa satu path kontinu

Scalable Vector Graphics (SVG) menyimpan bentuk dan path. Path menjelaskan geometri; stroke melukis sepanjang geometri itu. Garis tengah adalah rute melalui bagian tengah suatu tanda. Sebaliknya, dash yang di-outline memiliki batas tertutup mengelilingi lebar tanda.

Spesifikasi pewarnaan SVG mendefinisikan stroke-dasharray sebagai panjang terisi dan tidak terisi yang bergantian sepanjang path. Menambahkan stroke-dasharray="8 4" mengubah tampilan stroke. Tindakan ini tidak menulis ulang data d path menjadi potongan terpisah.

Perbedaan itu penting dalam penyerahan produksi. Panduan persiapan garis putus-putus Ponoko secara khusus merekomendasikan garis utuh kecil yang terpisah dan memperingatkan bahwa memperluas stroke putus-putus dapat menghasilkan kotak-kotak kecil. Panduan itu menjelaskan persyaratan persiapan Ponoko, bukan pengimpor SVG setiap aplikasi laser.

Untuk bingkai dekoratif yang tetap tampil di layar, mempertahankan stroke yang dapat diedit mungkin berguna. Panduan outline bertitik membahas bentuk cap dan jarak terlihat. Pekerjaan laser membutuhkan keputusan terpisah tentang geometri dan operasi yang Anda inginkan.

Bandingkan dua tampilan serupa dengan geometri berbeda

Kedua SVG buatan ini memakai halaman 100 mm × 20 mm dengan viewBox="0 0 100 20". Dengan pemetaan itu, satu unit pengguna setara satu milimeter. Garis memanjang dari x=10 hingga x=90, rentang 80 mm. Stroke 2 unit di bawah membuat perbandingan terlihat; itu bukan pengaturan laser atau rekomendasi lebar potong.

Pertama, simpan sebagai painted-dashes.svg:

<svg xmlns="http://www.w3.org/2000/svg"
     width="100mm" height="20mm" viewBox="0 0 100 20">
  <path d="M10 10 H90" fill="none" stroke="#0f766e"
        stroke-width="2" stroke-linecap="butt"
        stroke-dasharray="8 4" />
</svg>

Berkas ini melukis tujuh dash 8 mm yang dipisahkan enam celah 4 mm. Path tersimpannya tetap M10 10 H90: satu garis kontinu sepanjang 80 mm.

Sekarang simpan separate-segments.svg:

<svg xmlns="http://www.w3.org/2000/svg"
     width="100mm" height="20mm" viewBox="0 0 100 20">
  <g fill="none" stroke="#0f766e"
     stroke-width="2" stroke-linecap="butt">
    <path d="M10 10 H18" />
    <path d="M22 10 H30" />
    <path d="M34 10 H42" />
    <path d="M46 10 H54" />
    <path d="M58 10 H66" />
    <path d="M70 10 H78" />
    <path d="M82 10 H90" />
  </g>
</svg>

Berkas ini memiliki tujuh path terbuka terpisah. Jumlah panjangnya 56 mm, dan tidak ada geometri penghubung melintasi enam celah. Rentang titik ujung terluarnya tetap 80 mm. Kedua contoh memakai butt cap, sehingga warna stroke berhenti di setiap titik ujung dash.

Geometri SVG buatan
Render browser sebenarnya dari SVG buatan yang membandingkan satu path berwarna putus-putus, tujuh segmen garis tengah terpisah, dan tujuh persegi panjang outline dash
Tangkapan browser berkas buatan. Dua baris pertama memiliki tanda dash serupa tetapi panjang path tersimpan 80 mm dan 56 mm. Baris ketiga memperlihatkan keliling persegi panjang tertutup. Tidak ada impor aplikasi laser atau pemotongan fisik.

Kami memeriksa data path tersimpan dan memakai metode browser getTotalLength() untuk memeriksa geometri. Path kontinu menghasilkan 80 unit pengguna; setiap segmen terpisah menghasilkan 8, total 56. MDN mendokumentasikan metode ini sebagai panjang path yang dihitung browser dalam unit pengguna. Ini pengukuran geometri, bukan waktu pekerjaan terukur atau jalur alat yang dihasilkan aplikasi laser.

Anda dapat mengulangi diagnosis dasar tanpa kode: buka kembali setiap berkas tersimpan, pilih path dengan alat node, dan periksa titik ujungnya. Berkas pertama memiliki rute melintasi setiap celah yang terlihat. Berkas kedua memiliki titik ujung di kedua sisi setiap celah. Satu path SVG juga dapat berisi subpath yang tidak terhubung, jadi menghitung elemen path saja tidak cukup; periksa tempat setiap rute mulai, berhenti, dan menutup.

Perbaiki penyebab yang sesuai dengan berkas Anda

Celah hanya ada dalam pewarnaan stroke

Jika menghapus gaya putus-putus memperlihatkan satu rute kontinu, pilih apakah celah seharusnya berada dalam berkas atau pengaturan pekerjaan laser.

Untuk celah yang disimpan dalam SVG, kerjakan duplikat master:

  1. Hapus efek putus-putus dekoratif dari path yang Anda buat ulang.
  2. Gambar atau belah rute menjadi segmen terbuka pada titik ujung dash yang diinginkan.
  3. Hapus bagian penghubung yang seharusnya menjadi celah. Untuk contoh lurus, ulangi segmen 8 mm dengan ruang 4 mm.
  4. Periksa hasil dengan alat node. Setiap dash yang diinginkan harus memiliki satu garis tengah dan dua titik ujung.
  5. Simpan SVG baru, buka kembali, dan periksa celahnya lagi. Pastikan dimensi fisik sebelum mengimpornya ke aplikasi laser.

Untuk rute melengkung, tempatkan pemutusan sepanjang kurva itu. Angka 8/4 di sini menjelaskan satu contoh lurus; bukan spesifikasi perforasi yang sesuai untuk bahan Anda. Periksa kembali segmen ujung pendek, tikungan, dan sambungan di sekeliling bentuk tertutup.

Setiap dash menjadi outline tertutup kecil

Perintah expand atau stroke-to-path dapat mempertahankan dash yang terlihat sebagai bentuk tertutup. Itu mungkin sesuai jika Anda menginginkan garis luar suatu slot. Geometrinya berbeda dari satu garis pendek melalui bagian tengah dash.

Sebagai contoh dengan lebar terlihat, kami juga membuat tujuh persegi panjang tertutup, masing-masing 8 mm × 2 mm. Path satu persegi panjang adalah:

<path d="M10 9 H18 V11 H10 Z" />

Kelilingnya 20 mm; tujuh persegi panjang itu mengandung 140 mm geometri kontur tertutup. Jika operasi mengikuti batas tersebut, operasi mengikuti kedua sisi panjang serta ujungnya. Gambar menampilkan outline agar perbedaannya terlihat. Perhitungan ini tidak membuktikan cara pengimpor yang belum diuji memproses bentuk tersebut.

Jika Anda menginginkan garis tengah pendek pada setiap dash, buat ulang garis tengah itu alih-alih menerima kotaknya. Panduan SVG satu garis menjelaskan perbedaan garis tengah dan outline yang sama untuk tanda gambar. Jika outline yang Anda inginkan juga mengandung duplikat, gunakan panduan pemeriksaan garis ganda sebelum mengubah pengaturan mesin.

Celah seharusnya berada dalam pekerjaan LightBurn

Jika Anda mengendalikan pekerjaan LightBurn dan menginginkan interval potong/lewati yang dapat diatur, mempertahankan rute kontinu dapat berguna. Dokumentasi Line Mode LightBurn saat ini menjelaskan Perforation Mode dengan jarak Cut dan Skip terpisah. Pengaturan pekerjaan itu menentukan tempat sinar menyala dan mati sepanjang rute.

Pilih jarak untuk desain dan bahan Anda, lalu periksa pratinjau pekerjaan. Hindari menambahkan pola perforasi kedua pada geometri yang sudah terpisah kecuali pola tambahan itu memang disengaja.

Jika Anda perlu mengekspor geometri yang berasal dari pengaturan tersebut, LightBurn juga mendokumentasikan Generate Path From Cut. Fitur itu membuat path baru yang mencakup properti seperti perforasi dan mempertahankan objek asli. Bedakan versi asli dan versi hasil, serta pastikan pekerjaan akhir hanya berisi versi yang diinginkan.

Ini adalah alternatif berdasarkan dokumentasi. Kami tidak menjalankan LightBurn, mengimpor contoh ke dalamnya, atau mengoperasikan laser dalam demonstrasi ini. Verifikasi rute dan pengaturan dalam aplikasi Anda serta uji bahan sebenarnya sebelum menggunakan desain jadi.

Pisahkan desain yang dipulihkan dari path perforasi

Jika motif di sekitar garis putus-putus Anda hanya tersedia sebagai PNG atau JPEG datar, alur desain pemotongan laser PerfectVector dapat memulihkan bentuk SVG dari gambar raster itu. Bandingkan siluet dan bukaan hasil pemulihan dengan sumber sebelum menempatkan desain dalam pekerjaan. Vektorisasi membuat geometri dari piksel gambar; tidak memilih interval potong/lewati atau merancang garis tengah putus-putus dalam contoh ini.

Pertahankan desain tersebut dan rute perforasi yang sengaja digambar sebagai objek terpisah. Dash tebal yang dijiplak dapat menjadi area dengan outline, sedangkan pekerjaan Anda mungkin memerlukan satu garis tengah terbuka. Jika sudah memiliki desain vektor yang dapat digunakan, pertahankan dan edit rute putus-putus secara langsung. Panduan umum persiapan SVG laser membahas pemeriksaan potong-versus-ukir dan impor yang lebih luas.

Verifikasi berkas tersimpan dan pratinjau tujuan

Sebelum menerima SVG, periksa berkas hasil ekspor sebenarnya:

  • Dimensi fisik halaman dan desain sesuai catatan desain.
  • Setiap celah yang diinginkan tidak memiliki garis tengah penghubung, kecuali pengaturan pekerjaan membuat celahnya kemudian.
  • Dash garis yang diinginkan berupa segmen terbuka; outline dash tertutup hanya ada jika batas itulah yang dibutuhkan.
  • Rute asli dan geometri pengganti tidak sama-sama tertinggal dalam pekerjaan akhir.
  • Pratinjau tujuan memperlihatkan operasi dan pemutusan yang diinginkan.

Jika pratinjau masih menunjukkan rute utuh, periksa geometri hasil impor dan pengaturan perforasi pekerjaan secara terpisah. Jika terlihat dua tepi di sekitar setiap dash, periksa bentuk yang di-outline. Jika panjang celah berubah, periksa skala impor sebelum mengedit segmen satu per satu. Browser dapat memastikan render dan geometri SVG; pratinjau tujuan serta pengujian bahan menjawab pertanyaan produksi yang tersisa.

Tanya jawab

Mengapa SVG putus-putus saya menjadi utuh setelah impor? Berkas mungkin berisi satu path kontinu dengan gaya stroke putus-putus. Periksa geometri tersimpan dan pengaturan operasi tujuan. Buat segmen yang tidak terhubung jika celah harus ada dalam SVG, atau gunakan pengaturan perforasi pekerjaan yang didokumentasikan.

Apakah mengubah stroke putus-putus menjadi path sudah cukup? Periksa hasilnya. Memperluas stroke dapat membuat outline tertutup di sekitar dash. Pertahankan jika Anda menginginkan batasnya; buat ulang garis tengah terbuka jika setiap dash seharusnya berupa satu rute pendek.

Bisakah LightBurn membuat dash-nya? LightBurn mendokumentasikan Perforation Mode dengan jarak Cut dan Skip sepanjang rute. Periksa pratinjau dan bahan Anda. Artikel ini memverifikasi geometri SVG dan tidak mencakup impor LightBurn teruji atau pemotongan fisik.

Apakah vektorisasi PNG putus-putus membuat path perforasi? Jangan menganggap demikian. Vektorisasi memulihkan geometri dari piksel terlihat; garis tengah putus-putus dan interval potong/lewati tetap menjadi keputusan desain terpisah. Periksa path hasil sebelum menetapkan operasi.

Sumber

  1. W3C — Stroke SVG putus-putus — membedakan geometri path dari warna stroke serta mendefinisikan panjang dash dan perlakuan cap.
  2. Ponoko — Garis putus-putus dan tampilan lainnya — memberikan panduan garis terpisah khusus pemasok dan menjelaskan hasil kotak ber-outline.
  3. MDN — SVGGeometryElement.getTotalLength() — mendefinisikan pengukuran panjang path yang dihitung browser dalam contoh.
  4. LightBurn — Line Mode — mendokumentasikan jarak Cut dan Skip untuk Perforation Mode.
  5. LightBurn — Generate Path From Cut — mendokumentasikan geometri hasil serta penyimpanan objek asli.
  6. PerfectVector — Desain SVG untuk pemotongan laser — menjelaskan tahap konversi desain raster yang dipakai dalam pengantar produk bersyarat.

Mulai dari motif raster? Pulihkan desain SVG-nya, bandingkan kontur dengan sumber, lalu rancang rute putus-putus secara terpisah dan verifikasi seluruh pekerjaan dalam pratinjau aplikasi laser Anda.

Lebih banyak dari blog

PerfectVector

Siapkan path SVG yang rapi untuk
pemotongan dan produksi

Tanpa kartu kredit