Blog · Yol geometrisi

SVG path verisi, durum taşıyan küçük bir çizim dilidir.

Yol sayılarını değiştirmeden önce geçerli noktayı, alt yolları, eğri kontrollerini, yay bayraklarını, kapanışı, dolgu kurallarını ve hassasiyeti anlayın.

Her komut geçerli noktayı okur ve günceller.

Path verisi soldan sağa işlenir. M bir alt yol başlatır; L doğru çizer; H ve V doğruyu tek eksene sınırlar; C ve Q üçüncü ve ikinci derece Bézier eğrileri çizer; A eliptik yay çizer; Z geçerli alt yolu kapatır. Küçük harfli komutlar geçerli noktaya göre bağıl, büyük harfli komutlar geçerli kullanıcı koordinat sistemine göre mutlak değerler kullanır.

Bir komut harfini çoğu zaman birden fazla koordinat kümesi izleyebilir. Fazladan kümeler aynı işlemi tekrarlar; yalnızca ilk moveto sonrasındaki koordinat çiftleri line komutu gibi değerlendirilir. Sıkıştırılmış sözdizimi teslim için yararlıdır, ancak bozuk geometriyi incelerken açık komutlar daha kolay takip edilir.

  • Mutlak komutlar kullanıcı uzayındaki konumları anlatır
  • Bağıl komutlar geçerli noktadan olan farkları anlatır
  • Sözdizimi izin verdiğinde atlanan komut harfi önceki işlemi tekrarlar

Tek bir path birden fazla bağımsız alt yol içerebilir.

Her moveto yeni bir path öğesi oluşturmadan yeni alt yol başlatır. Böylece tek bir path, aynı boya ve dönüşümü paylaşan ayrı adaları, delikleri veya bağlantısız konturları temsil edebilir. Geçerli nokta yeni başlangıca atlar; önceki alt yollar aynı dolgu ve kontur hesabının parçası olmaya devam eder.

Closepath her zaman başlangıca son bir doğru çizmekle eşdeğer değildir. Kapatma, son ve ilk segment arasında açık bir birleşim oluşturur; aynı koordinatta biten ama kapatılmayan bir çizginin iki ayrı ucu vardır. Kalın konturlarda, yuvarlak olmayan birleşimlerde, işaretçilerde ve kesik desenlerinde bu fark görünür olur.

Bézier kontrol noktaları uğrak noktalarını değil, teğetleri yönlendirir.

İkinci derece Bézier segmentinde bir, üçüncü derece segmentte iki kontrol noktası vardır. Eğri normalde bu kontrollerin üzerinden geçmez. Başlangıçtan ilk kontrole uzanan doğru başlangıç teğetini; son kontrolden bitişe uzanan doğru bitiş teğetini belirler. Kontrolün uzaklığı, eğrinin o yöne ne kadar güçlü çekildiğini etkiler.

S ve T yumuşak komutları, önceki uyumlu eğrinin ilgili kontrol noktasını geçerli nokta çevresinde yansıtarak bir kontrol türetir. Önceki segment uyumlu değilse türetilen kontrol geçerli noktaya eşittir. Yumuşak komutlar veriyi kısaltır; ancak bir düğüm bağımsız taşınmadan önce editörün bağlamı doğru biçimde açması gerekir.

  • Q bir, C iki kontrol noktası kullanır
  • Önceki komut uygunsa S üçüncü derece teğeti sürdürür
  • Önceki komut uygunsa T ikinci derece teğeti sürdürür

Yay komutu olası birkaç elipsten birini seçer.

A komutu x yarıçapı, y yarıçapı, x ekseni dönüşü, büyük-yay bayrağı, süpürme bayrağı ve bitiş noktası verir. Başlangıç noktası geçerli path durumundan gelir. Bu değerler merkezi doğrudan belirtmez; tarayıcı bir elips türetir ve başlangıçla bitişi bağlayan olası yaylardan birini seçer.

Büyük-yay bayrağı 180 dereceyi aşmayan yayla onun tamamlayıcısı arasında; süpürme bayrağı ise geçerli koordinat sistemindeki yönler arasında seçim yapar. Verilen yarıçaplar iki ucu bağlamak için küçükse SVG algoritması onları büyütür. Yarıçaplardan birinin sıfır olması segmenti doğru gibi görüntüler; beklenen eğri kaybolduğunda bu ayrıntıyı hatırlamak yararlıdır.

Dolgu kuralları hangi kapalı bölgelerin içeride olduğunu belirler.

Kontur her alt yolu izler; dolgu ise bölgeleri sınıflandırmak zorundadır. nonzero kuralı işaretli kesişimleri sayar ve alt yol yönünden etkilenir. Aynı yönde sarılmış dış konturlar ve ters yönde sarılmış delikler için doğal çalışır. evenodd kuralı yönü dikkate almadan kesişim sayısını kullanır ve dışarıyla içerisi arasında sırayla geçiş yapar.

Bu nedenle görünür sınırları aynı olan iki şekil, alt yol sırası veya yönü değiştiği için farklı dolabilir. Boolean işlemleri, yol yönünü ters çevirme ve şekilleri birleştirme; seçilen dolgu kuralıyla birlikte sarımı korumalı veya bilinçli biçimde normalleştirmelidir.

  • nonzero işaretli sarım sayısını kullanır
  • evenodd kesişim sayısının tek ya da çift olmasını kullanır
  • Açık alt yollar dolgu için örtük kapanır, kontur için açık kalır

Path verisini ancak hata bütçesini belirledikten sonra küçültün.

Her sayıyı aynı ondalık basamağa yuvarlamak kolaydır ama her zaman güvenli değildir. Görünür hata; belge ölçeğine, sonraki dönüşümlere, kontur kalınlığına, animasyona, kırpmaya ve komşu segmentlerin ne kadar kesin birleşmesi gerektiğine bağlıdır. Küçük koordinat değişimleri dikiş açabilir, teğetleri değiştirebilir veya bir yayı belirgin biçimde başka çözüme taşıyabilir.

Optimizasyon, önemli gösterim boyutlarında hem görüntülenen hem geometrik sonucu karşılaştırmalıdır. Gereksiz komutları ve hassasiyeti aşamalı azaltın; ortak sınırlar için yeterli basamak bırakın; dolguyu, konturu, işaretçileri ve kırpmayı ayrı ayrı sınayın. Topolojiyi değiştiren daha kısa bir path optimizasyon değildir.

  • Path ilk nerede ayrışıyorsa o noktadaki geçerli durumu inceleyin
  • Hata ayıklarken kısaltılmış komutları açık hâle getirin
  • Kontrol noktalarından önce kapanışı, sarımı ve yay bayraklarını denetleyin
  • Görsel hatayı yalnız kaynak koordinatlarında değil, dönüşümlerden sonra ölçün