SVG yanlış boyutta içe aktarılıyor: Teşhis ve çözüm

SVG yanlış boyutta içe aktarıldığında yollar genellikle zarar görmüş değildir. Dışa aktaran uygulama ile içe aktaran uygulama, SVG'nin koordinat birimlerinin piksel, inç veya milimetreye nasıl karşılık geldiği konusunda farklı davranır. Bu nedenle aynı dosya tarayıcıda doğru görünebilir, Figma'ya çok küçük gelebilir ve CAD ya da kesim yazılımına başka bir ölçekte aktarılabilir.

Henüz tek tek parçaları yeniden çizmeyin veya boyutlandırmayın. Boyutu bilinen bir referans kare ekleyin, dosyanın tamamını içe aktarın ve bu kareyi ölçün. Tek bir ölçüm, belge ölçeğinin mi değiştiğini yoksa çizimin kendisinin mi yanlış olduğunu gösterir.

Bir SVG'nin içindeki üç boyut

SVG, gündelik dilde hepsine “boyut” dediğimiz, birbiriyle ilişkili üç şeyi tanımlayabilir. SVG 2 koordinat sistemi belirtimi, kullanıcı koordinatları, görüntü alanı ve viewBox arasındaki ilişkiyi tanımlar.

1. Geometri, yolların ve şekillerin içindeki koordinatlardır. Bir dikdörtgen, dosyanın kendi koordinat sisteminde 0'dan 100'e kadar uzanabilir.
2. viewBox, bu koordinat sisteminin hangi dikdörtgeninin görünür olması gerektiğini belirtir. viewBox="0 0 100 100", görünür çizim alanının her yönde 100 kullanıcı birimi kapsadığı anlamına gelir.
3. Görüntü alanı, görüntülenen veya içe aktarılan boyuttur. Kök öğe width="100mm", width="400" tanımlayabilir ya da hiç genişlik belirtmeyebilir. Değeri kendi belge birimlerine nasıl dönüştüreceğine alıcı uygulama karar verir.

Aşağıda, fiziksel çıktı boyutu açıkça belirtilmiş, 100 birimlik eksiksiz bir kare var:

<svg xmlns="http://www.w3.org/2000/svg"
  width="25mm" height="25mm" viewBox="0 0 100 100">
  <rect x="0" y="0" width="100" height="100" fill="#2563eb" />
</svg>

Geometri 100 × 100 kullanıcı birimidir; hedeflenen görüntü alanı ise 25 × 25 mm'dir. viewBox, bir koordinat uzayını diğerine eşler. width ve height değerlerini kaldırırsanız ya da bunları birimsiz sayılara dönüştürürseniz içe aktarıcı, görüntüleme boyutunu kendisi seçmek için daha fazla serbestlik kazanır.

SVG düzenleme hakkındaki daha kapsamlı rehber, güvenli kod değişikliklerini ele alır. Bu sorunda, kök <svg> öğesini incelerken yol verilerine dokunmayın.

Neden suç DPI'a atılır?

SVG yollarının PNG veya JPG gibi bir piksel çözünürlüğü yoktur. Yazılım CSS pikselleri ile fiziksel birimler arasında dönüşüm yaptığında veya bir tasarım uygulaması bu birimlere kendi dışa aktarma kuralını uyguladığında DPI gündeme gelir.

CSS Values belirtimi, 1in değerini 96 CSS pikseli, 1pt değerini ise bir inçin 1/72'si olarak tanımlar. CSS piksellerini yanlışlıkla punto kabul eden bir iş akışı, sık rastlanan 96/72, yani 1,333 ölçek uyuşmazlığını oluşturur. İçe aktarıcı fiziksel width ve height değerlerini yok saydığında, yalnızca viewBox kullandığında veya kendi belge birimi ayarını uyguladığında başka katsayılar da ortaya çıkabilir.

Bu yüzden “DPI'ı değiştirin” önerisi eksiktir. Değiştirilecek bir raster DPI değeri bulunmayabilir. Önce ölçek katsayısını hesaplayın:

scale factor = intended size / imported size

100 mm'lik bir kare 75 mm olarak içe aktarılıyorsa düzeltme katsayısı 100 / 75 = 1.3333 olur. İçe aktarılan eskizin veya belgenin tamamını bu katsayıyla ölçeklendirin, ardından kareyi yeniden kontrol edin.

Referans kare, ilk içe aktarmada aynı görünebilen iki sorunu ayırır. Kare ve çizim aynı oranda sapıyorsa belgenin tamamını düzeltin. Kare doğru ancak çizim yanlışsa belge birimlerine dokunmayın; çizimin sınırlarını veya dönüşümlerini inceleyin.

Referans kare testini uygulayın

Rahatça ölçülebilecek kadar büyük, ancak çizimin yanına sığacak kadar küçük bir kare kullanın.

1. Kaynak düzenleyicide tam 10 mm, 1 inç veya başka bir bilinen boyutta kare çizin.
2. Belirgin bir dolgu veya kontur verin ve bitmiş tasarımın dışına yerleştirin.
3. Çizimi ve kareyi birlikte tek bir SVG olarak dışa aktarın.
4. Dosyayı, boyutlandırma tutamacını sürüklemeden hedef uygulamaya içe aktarın.
5. Kareyi hedef uygulamanın ölçülendirme aracıyla ölçün.
6. Hedeflenen boyutu içe aktarılan boyuta bölün.
7. İçe aktarılan içeriğin tamamını bir kez ölçeklendirin. Şekilleri ayrı ayrı boyutlandırmayın.
8. Kareyi ancak son ölçüm doğru çıktıktan sonra silin.

Bu test, yanlış bir tanıyı da ortaya çıkarır. Referans kare doğru içe aktarılıyorsa belge birimleri muhtemelen düzgündür. Bunun yerine dönüşüm uygulanmış bir grup, görsel genişliği sınırlara dahil edilmiş bir kontur, tuval dışındaki bir nesne veya içeriği sayfaya sığdıran bir içe aktarıcı arayın. Keskin bir kontur köşesi görünür sınırları değiştiriyorsa belgenin fiziksel ölçeğini değiştirmeden önce sivri kontur çıkıntılarını teşhis etme rehberini izleyin.

CNC, lazer ve 3D çalışmalarında fiziksel birimlerle tanımlanmış bir kare kullanın. Piksel cinsinden bir kare orantılı ölçeklendirmeyi doğrulayabilir, ancak makine iş akışının gerektirdiği milimetre ölçüsünü kanıtlamaz.

Dosyayı mı, içe aktarmayı mı düzeltmelisiniz?

Ana dosya sizin kontrolünüzdeyse ve onu sürekli aynı tür iş akışına gönderiyorsanız dosyayı düzenlemek yararlıdır. CAD veya kesim uygulamasının bilinen bir ölçek kuralı varsa ve SVG diğer her yerde zaten doğru davranıyorsa içe aktarmayı düzeltmek daha güvenlidir.

CAD ve kesim yazılımları ek bir kontrol gerektirir

Tarayıcının yalnızca görüntüyü çizmesi gerekir. CNC, lazer ve 3D iş akışlarında ise fiziksel sonucun tam doğru olması gerekir. Ölçek doğrulandıktan sonra geometriyi ayrıca kontrol edin:

• Makine belgesinin beklenen birimleri kullandığını doğrulayın.
• Yalnızca genel sınırlayıcı kutuyu değil, gerçek bir tasarım öğesini ölçün.
• Kapalı profillerin kapalı kaldığını kontrol edin.
• Sınırları büyüten gizli bir arka plan dikdörtgeni olup olmadığına bakın.
• Malzemeyi işlemeden önce takım yolu, eskiz veya ekstrüzyon önizlemesini doğrulayın.

CNC için görüntüyü SVG'ye dönüştürme rehberi, yol temizliğini ve CAM'e aktarımı ele alır. Sonraki adım ekstrüzyonsa ölçek düzeldikten sonra 3D baskı için SVG iş akışını kullanın.

Shaper Origin için fiziksel boyut ve kesim türü kontrol listesiyle devam edin. Ölçeği doğrulamak adımlardan biridir; frezelemeye başlamadan önce içe aktarılan yollara amaçlanan kesim türlerinin de atanması gerekir.

Hedeflenen boyutları doğruladıktan sonra kesim makinenizin son hazırlık ekranına geçmeden önce boyutu bir kesim matı üzerinde kontrol edin.

Basılı resimli kartlar için görsel program kartı yerleşim rehberi, çizimin yerleşimini, PDF sayfa boyutlarını ve baskı ölçeklendirmesini kontrol eder. Doğru boyuttaki bir SVG bile yazıcının küçülttüğü bir sayfaya yerleşebilir.

PerfectVector bu süreçte nerede yer alır?

PerfectVector, raster çizimleri düzenlenebilir SVG yollarına dönüştürür. Elinizdeki tek kaynak PNG veya JPG olduğunda ve CAM için vektör geometriye ihtiyaç duyduğunuzda CNC için SVG ve DXF iş akışı yararlıdır. Parçanızın son fiziksel boyutunu bilmez; bu nedenle hedef yazılımda boyutları yine sizin ayarlayıp doğrulamanız gerekir.

Bu görev ayrımı önemlidir. Vektörleştirme, ölçeklenebilir şekilleri yeniden oluşturur. Boyutu bilinen bir kare ve CAM ölçümü ise fiziksel ölçeği belirler. Bunları iki ayrı kontrol olarak ele almak, temiz bir vektörleştirme sonucunun yanlış boyutta bir kesime dönüşmesini önler.

Sık sorulan sorular

SVG'm neden dışa aktarıldığından daha küçük içe aktarılıyor? Dışa aktaran ve içe aktaran uygulamalar SVG kullanıcı birimlerini, CSS piksellerini, puntoları veya fiziksel birimleri farklı şekilde eşliyor olabilir. Boyutu bilinen bir kare ekleyin ve hedeflenen ölçülerini içe aktarılan ölçülerle karşılaştırın. Dosyanın tamamı tek bir katsayıyla değiştiyse tek tek yolları düzenlemek yerine belgeyi bir kez ölçeklendirin.

SVG'nin DPI değeri var mı? SVG geometrisi çözünürlükten bağımsızdır; dolayısıyla raster görüntü gibi sabit bir piksel yoğunluğu yoktur. Yazılım CSS piksellerini veya tasarım birimlerini inç ya da milimetreye eşlediğinde DPI benzeri dönüşümler önem kazanır. Uyuşmazlığın kaynağı çoğu zaman gizli bir görüntü çözünürlüğü değil, içe aktarıcının kullandığı kuraldır.

viewBox, SVG boyutunu nasıl etkiler? viewBox, görünür koordinat dikdörtgenini tanımlar ve görüntüleyicinin bu kullanıcı birimlerini görüntü alanına eşlemesini sağlar. Tek başına fiziksel bir boyut belirtmez. Kök width ve height değerleri, CSS veya alıcı uygulama, görüntü alanının ne kadar büyük olacağını belirler.

SVG'm tarayıcıda doğru boyuttayken Fusion veya LightBurn'de neden yanlış? Tarayıcı SVG'yi bir CSS görüntü alanında gösterebilir; CAD ve lazer yazılımlarının ise onu fiziksel belge birimlerine eşlemesi gerekir. Bu içe aktarıcılar farklı bir kural kullanabilir veya SVG'nin boyut meta verilerinin bir kısmını yok sayabilir. Bir referans kare ölçün ve elde ettiğiniz ölçek katsayısıyla içe aktarılan içeriğin tamamını düzeltin.

Boyutunu düzeltmek için SVG'yi DXF'e dönüştürmeli miyim? İlk adım olarak hayır. Biçim dönüşümü aynı ölçek belirsizliğini taşıyabilir veya yeni bir belirsizlik oluşturabilir. Önce bir referans kareyle katsayıyı belirleyin. Hedef iş akışı tercih ediyorsa DXF kullanın; ardından içe aktardıktan sonra boyutları yeniden doğrulayın.

Kaynaklar

1. W3C — SVG 2 Coordinate Systems — Kullanıcı birimlerini, görüntü alanlarını, viewBox ve dönüşümleri tanımlar.
2. W3C — CSS Values and Units Level 4 — CSS pikselleri, inçler ve puntolar arasındaki referans dönüşümleri tanımlar.
3. Autodesk Fusion — Insert SVG — Fusion eskizlerinde SVG yerleştirme ve ölçek kontrollerini belgeler.

Takım yolu oluşturmadan veya kesime başlamadan önce SVG ya da DXF'i CNC için hazırlayın ve sonucu inceleyin. Kareyi üretim dosyasından kaldırmadan önce referans kareyi, gerçek bir tasarım öğesini ve son CAM önizlemesini ölçün.