Cara Membuat Jembatan Terisi yang Bertemu dengan Dua Lingkaran pada Kelilingnya

Jembatan dapat menyentuh lingkaran tanpa menyambung mulus dengan garis luarnya. Menempatkan sudut di sembarang titik pada keliling memang menghasilkan kontak, tetapi sisi jembatan masih dapat membentuk sudut yang terlihat. Agar transisinya mulus, sisi tersebut harus mengikuti garis singgung lingkaran di titik kontak.

Untuk dua lingkaran yang terpisah, gunakan sepasang garis singgung luar persekutuan: garis yang membentang di sepanjang bagian luar kedua lingkaran. Setiap titik kontak terletak pada lingkarannya, dan jari-jari yang melewati titik tersebut tegak lurus terhadap garis singgung. Kondisi ini dinyatakan dalam persamaan garis singgung lingkaran-lingkaran Wolfram MathWorld.

Keempat titik kontak menentukan segi empat konstruksi. Kedua sisi panjangnya menjadi tepi jembatan yang terlihat; kedua sisi penutupnya melintasi lingkaran. Sisi penutup tersebut akan hilang saat bentuk-bentuknya digabungkan atau bagian lingkaran yang bertumpang tindih dihapus.

Konstruksi ini menghasilkan penghubung bersisi lurus. Penghubung yang melengkung ke dalam dan menyempit memerlukan rancangan kurva yang berbeda; titik-titik singgung saja tidak menentukan bentuk tersebut.

Mulailah dengan dua lingkaran utuh, isian warna solid, dan tanpa goresan. Gunakan satuan koordinat yang sama secara konsisten. Goresan yang terlihat dapat menutupi batas yang ingin Anda sesuaikan, jadi tambahkan garis luar akhir setelah geometri terisi selesai dibuat.

Di Inkscape, pilih alat Ellipse dengan E, lalu tahan Ctrl sambil menyeret untuk membuat lingkaran. Untuk ukuran yang presisi, atur nilai Rx dan Ry yang sama pada kontrol alat. Jika objek berupa busur atau segmen, gunakan Make ellipse whole sebelum melanjutkan. Kontrol ini dijelaskan dalam panduan Inkscape tentang lingkaran, elips, dan busur.

Buka Object → Fill and Stroke. Atur isian solid dan pilih kontrol No paint berbentuk silang di bawah Stroke paint. Pertahankan opasitas pada 100% selama memeriksa konstruksi. Lihat Dialog Fill and Stroke untuk pengaturan ini.

Simpan salinan cadangan kedua lingkaran asli di luar area kerja. Operasi Boolean akhir akan mengubah konstruksi, dan lingkaran asli tersebut memudahkan penyesuaian selanjutnya.

Gunakan ukuran ilustratif berikut. Ukuran ini sengaja menghasilkan penghubung yang sangat meruncing, sehingga geometri kontak mudah diperiksa. Koordinat menggunakan piksel, dengan x bertambah ke kanan dan y bertambah ke bawah.

Objek	Pusat	Jari-jari	Kotak pembatas
Lingkaran A	(100, 100)	70	x = 30–170; y = 30–170
Lingkaran B	(200, 100)	10	x = 190–210; y = 90–110

Jarak antara kedua pusat adalah 100 satuan. Setelah dikurangi jari-jari, jarak antara tepi lingkaran yang terdekat adalah 20 satuan. Jembatan harus membentang melintasi celah itu sambil menyambung mulus dengan garis luar lingkaran.

Untuk kedua lingkaran ini, keempat titik kontak garis singgung adalah:

Titik	Lokasi	Koordinat
A atas	Titik kontak atas pada Lingkaran A	(142, 44)
B atas	Titik kontak atas pada Lingkaran B	(206, 92)
B bawah	Titik kontak bawah pada Lingkaran B	(206, 108)
A bawah	Titik kontak bawah pada Lingkaran A	(142, 156)

Pilih alat Bézier/Pena, lalu buat jalur bersudut empat sesuai urutan pada tabel. Klik setiap sudut tanpa menyeret, lalu klik titik awal untuk menutup jalur. Gunakan isian solid yang sama dengan lingkaran dan hapus goresannya.

Untuk penempatan yang presisi, gambar segi empat itu secara perkiraan terlebih dahulu. Beralihlah ke alat Node dengan N, pilih satu node setiap kali, lalu masukkan koordinat x dan y-nya pada kontrol alat. Atur satuan koordinat ke piksel. Inkscape mendokumentasikan kolom angka ini dalam Opsi Alat Node.

Ikuti keliling saat menghubungkan titik-titik: A atas → B atas → B bawah → A bawah → tutup. Menghubungkannya secara diagonal melintasi bentuk akan menghasilkan jalur bersilangan, bukan jembatan terisi yang dimaksud.

Koordinat contoh ini telah diperiksa dengan perhitungan deterministik: setiap titik kontak berjarak tepat dari pusat lingkarannya, dan setiap tepi jembatan yang panjang tegak lurus terhadap jari-jari kontak yang bersesuaian.

Pilih struktur akhir sesuai cara Anda ingin mengedit atau mewarnai karakter.

Hasil yang diinginkan	Konstruksi
Satu siluet utuh dengan satu warna	Gabungkan kedua lingkaran dan segi empat
Jembatan berwarna terpisah yang berhenti di lingkaran	Kurangi salinan lingkaran dari segi empat
Konstruksi yang dapat diedit untuk penyesuaian selanjutnya	Simpan lingkaran asli dan segi empat sebelum salah satu operasi dilakukan

Untuk satu siluet, pilih kedua lingkaran dan segi empat, lalu pilih Path → Union. Untuk jembatan terpisah, duplikasikan lingkaran, gabungkan duplikat tersebut menjadi satu pemotong, lalu letakkan pemotong itu di atas segi empat. Pilih pemotong dan segi empat, lalu pilih Path → Difference. Jangan sertakan lingkaran asli dalam pilihan ini.

Difference menghapus bagian lingkaran yang bertumpang tindih, sehingga menyisakan ujung jembatan melengkung yang mengikuti batas lingkaran yang saling berhadapan. Union mempertahankan garis luar terisi secara keseluruhan. Operasi ini dan pentingnya urutan penumpukan dijelaskan dalam panduan Operasi Boolean Inkscape.

Sisi penutup lurus pada segi empat adalah tepi konstruksi. Jika segi empat yang belum dipotong dibiarkan terlihat dengan warna berbeda, tali busur tersebut akan tampak di dalam lingkaran. Gunakan alur kerja pengurangan jika jembatan perlu memiliki warna tersendiri dan harus berakhir tepat pada keliling lingkaran.

Rumus berikut adalah panduan pengambilan keputusan turunan berdasarkan kondisi panjang jari-jari dan ketegaklurusan dalam persamaan garis singgung MathWorld. Rumus ini berlaku untuk lingkaran pada posisi sembarang, sehingga lingkaran tidak harus sejajar horizontal.

Misalkan pusatnya adalah A = (ax, ay) dan B = (bx, by), dengan jari-jari positif rA dan rB. Pertama, hitung jarak antara pusat dan vektor satuan yang mengarah dari A ke B:

d = sqrt((bx − ax)² + (by − ay)²)

u = (ux, uy) = ((bx − ax) / d, (by − ay) / d)

Buat vektor satuan tegak lurus v = (−uy, ux). Lalu hitung:

q = (rA − rB) / d

s = sqrt(1 − q²)

n₁ = q·u + s·v

n₂ = q·u − s·v

Perkalian vektor di sini berarti mengalikan setiap komponen dengan skalar. Setiap vektor n mengarah dari pusat menuju titik kontak garis singgung. Keempat titiknya adalah:

• A₁ = A + rA·n₁
• B₁ = B + rB·n₁
• A₂ = A + rA·n₂
• B₂ = B + rB·n₂

Gambar keliling A₁ → B₁ → B₂ → A₂ → tutup. Normal mana pun dapat mewakili sisi atas, tergantung susunan lingkaran dan orientasi koordinat.

Untuk contoh pengerjaan, u = (1, 0), q = 0.6, dan s = 0.8. Kedua normalnya adalah (0.6, 0.8) dan (0.6, −0.8). Kalikan masing-masing dengan setiap jari-jari, lalu tambahkan pusat yang bersesuaian untuk memperoleh keempat koordinat yang telah dicantumkan sebelumnya.

Konstruksi ini mengikuti langsung dari vektor-vektor tersebut: setiap normal memiliki panjang satu, sehingga titik kontaknya berada pada lingkaran. Hasil kali titiknya dengan ruas garis di antara pasangan titik kontak bernilai nol, yang memastikan ketangensian. Untuk jari-jari yang sama, q = 0, sehingga sisi jembatan sejajar dengan garis yang menghubungkan pusat-pusatnya.

Untuk kasus lingkaran terpisah, syaratnya d > rA + rB. Ini menghasilkan celah nyata yang dapat diisi jembatan. Jika lingkaran sudah saling bertumpang tindih, menggabungkannya mungkin tetap berguna, tetapi hasilnya menangani persoalan bentuk yang berbeda.

Rumus itu sendiri memerlukan d > |rA − rB| agar menghasilkan dua sisi garis singgung luar yang berbeda. Pada batas kesamaan, konstruksi garis singgung menjadi runtuh. Di bawah ambang tersebut, satu lingkaran berada di dalam lingkaran lainnya dan akar kuadratnya tidak memiliki nilai riil. Pusat yang berimpit juga membuat perhitungan vektor satuan tidak terdefinisi. Batasan ini mengikuti rumus di atas.

Hitung ulang titik kontak setiap kali Anda memindahkan atau mengubah ukuran salah satu lingkaran. Menggeser sudut jembatan dengan perkiraan mata mungkin mempertahankan kontak, tetapi menghilangkan ketangensian. Demikian pula, meregangkan lingkaran menjadi elips mengubah geometrinya; rumus khusus lingkaran ini tidak lagi berlaku.

Periksa hasilnya dengan pembesaran dekat dan pada ukuran tampilan yang dituju. Gunakan urutan berikut untuk mengetahui penyebab cacat yang terlihat:

1. Periksa isiannya. Pastikan segi empat tertutup, terisi, dan tidak memiliki segmen yang bersilangan.
2. Periksa geometri lingkaran. Pastikan pusat, jari-jari, dan satuan koordinat sesuai dengan perhitungan.
3. Periksa keempat titik kontak. Perbaiki koordinat node sebelum mengubah gagang kurva.
4. Periksa struktur akhir. Pastikan Union atau Difference menghasilkan siluet atau jembatan terpisah yang Anda inginkan.
5. Periksa garis luar. Tambahkan goresan pada siluet akhir jika desain mengharuskannya; periksa bagian-bagian yang digores secara terpisah untuk memastikan tidak ada batas internal yang tidak diinginkan.

Untuk pemeriksaan numerik, ukur jarak setiap titik kontak dari pusatnya: jaraknya harus sama dengan jari-jari lingkaran tersebut. Lalu pastikan setiap sisi jembatan yang terlihat tegak lurus terhadap jari-jari kontaknya. Pemeriksaan ini membedakan sambungan yang presisi dari sambungan yang sekadar tampak sejajar.

Setelah titik kontaknya benar, tinggal memilih cara mengatur karya seni: sebagai satu siluet terpadu atau beberapa bagian terisi yang terpisah. Simpan lingkaran sumber dan titik-titik hasil perhitungan, maka Anda dapat membangun ulang jembatan yang pas di tepinya setiap kali proporsi karakter berubah.

• Lingkaran, Elips, dan Busur — Panduan Pemula Inkscape
• Dialog Fill and Stroke — Panduan Pemula Inkscape
• Opsi Alat Node — Panduan Pemula Inkscape
• Operasi Boolean — Panduan Pemula Inkscape
• Garis Singgung Lingkaran-Lingkaran — Wolfram MathWorld