PerfectVector
Yazan Irene Kim9 dk okuma

SVG grubu çözülemiyor: Nesneyi tanıyın ve düzeltin

SVG grubu çözülemiyorsa nesne bir grup değil, tek bir yol, bileşik yol veya gömülü görüntü olabilir. Önce nesneyi tanıyın, sonra doğru çözümü uygulayın.

Bu sayfada

Ungroup yalnızca seçili nesne gerçekten bir grup olduğunda çalışır. Birkaç parçadan oluşuyor gibi görünen bir SVG aslında tek bir bileşik yol, tek bir sıradan yol, kırpılmış bir nesne veya SVG kapsayıcısının içine yerleştirilmiş bir raster görüntü olabilir. Ungroup komutuna tekrar tıklamak bu yapıların hiçbirini değiştirmez.

İşe yarayan soru “Doğru Ungroup komutu nerede?” değil, “Neyi seçtim?” sorusudur. Bunu belirledikten sonra çözüm genellikle basittir: gerçek bir grubu çözün, bileşik yolu parçalara ayırın, tek bir yolun düğümlerini düzenleyin veya gömülü raster görüntüyü vektörleştirerek gerçek vektör şekillere dönüştürün.

Hızlı teşhis
  • Nesne panelinde bir grup görünüyorsa veya SVG kaynak kodu <g> içeriyorsa Ungroup kullanın.
  • Tek bir seçim ayrı delikler veya adacıklar içeriyorsa bir kopya üzerinde Break Apart ya da Release Compound Path deneyin.
  • Düğüm düzenleme tek bir dış hat gösteriyorsa çözülecek bir grup yoktur. O yolu düzenleyin veya bölün.
  • Nesne tek bir dikdörtgense ve büyütüldüğünde pikseller belirginleşiyorsa muhtemelen gömülü bir görüntüdür. Orijinal raster görüntüyü bulun ve düzgün biçimde vektörleştirin.

Önce hangi tür nesneyi seçtiğinizi kontrol edin

SVG bir kapsayıcı biçimidir; görünen her parçanın ayrı bir katman olduğunu garanti etmez. Gruplanmış vektör öğeleri, tekil yollar, bileşik yollar, metin, kırpma yapıları ve raster görüntüler içerebilir. Bir tuval düzenleyicisi geliştiriyorsanız Fabric.js SVG içe aktarma rehberi, ayrı nesnelerin nasıl ayrıştırılacağını, adı belirlenmiş bir parçanın nasıl yeniden renklendirileceğini ve dışa aktarılan SVG'nin nasıl inceleneceğini gösterir.

diagrams.net'te içe aktarılan çizimin grubunu çözmeye çalışmadan önce draw.io SVG görüntülerini ve yerel şablon şekillerini karşılaştırın. Ölçeklenebilir bir görüntü ile bağlantı noktaları tanımlanmış bir diyagram şeklinin düzenleme iş akışları farklıdır.

Aynı görüntü ile yerel şekil ayrımının başka bir diyagram düzenleyicisindeki karşılığı için Excalidraw SVG içe aktarımından sonra nelerin düzenlenebilir olduğunu inceleyin.

Aynı belirtinin Cricut Design Space, Silhouette Studio, LightBurn, Inkscape, Illustrator ve ofis uygulamalarında görülmesinin nedeni budur. PowerPoint'te önce PowerPoint SVG dönüştürme ve parça düzenleme rehberini kullanarak SVG grafiği ile Office şekillerini ayırt edin. Her program komutlarını farklı adlandırır, ancak alttaki dosya yine yaygın birkaç yapıdan birine sahiptir.

Gördüğünüz şeyDosyanın muhtemel içeriğiDeneyebileceğiniz işlem
Birkaç nesne birlikte seçiliyor ve katman panelinde bir grup görünüyorGerçek bir SVG grubuUngroup
Birkaç adacık veya delik tek nesne olarak seçiliyorBileşik yolBir kopyada serbest bırakın veya parçalara ayırın
Tek bir dış hatta düzenlenebilir düğümler görünüyorTek bir yolDüğümleri düzenleyin, yolu kesin veya bölün
Tek bir dikdörtgen nesne seçiliyor; yakınlaştırınca pikseller görünüyorGömülü raster görüntüRaster kaynağı çıkarın veya bulun, ardından vektörleştirin
Çizimin bir bölümü bir sınırın arkasında gizlenmişKırpma yolu veya maskeKırpmayı serbest bırakın veya içeriğini düzenleyin
Dört yapı, dört çözüm
Bir SVG grubunu, delikli bileşik yolu, düğümleri olan tek bir yolu ve gömülü raster görüntüyü karşılaştıran kavramsal ayrıştırılmış görünüm
Kavramsal diyagram: çizimler grup, bileşik yol, tek yol veya gömülü görüntü olarak oluşturulmuş olsalar da aynı derecede bütün görünebilir.

Ungroup yalnızca bir grup söz konusuysa çözüm sağlar

SVG işaretlemesinde <g> öğesi diğer SVG öğeleri için bir kapsayıcıdır ve standart, grupların istenen derinlikte iç içe yerleştirilmesine izin verir. Bir tasarımcı, birlikte hareket etmeleri için bir daireyi, yazı logosunu ve arka planı gruplayabilir. Grubu çözmek, düzenleyicinin grup kapsayıcısını kaldırır ve içindeki öğeleri erişilebilir hâle getirir.

Şunu deneyin:

  1. Dosyayı çoğaltın veya bir çalışma kopyası kaydedin.
  2. Nesneyi bir kez seçin.
  3. Tuvale güvenmek yerine Layers veya Objects paneline bakın.
  4. Seçili öğe bir grupsa Ungroup komutunu bir kez çalıştırın.
  5. Yalnızca dosya iç içe gruplar içeriyorsa tekrarlayın.

İç içe gruplar yaygındır. Bir logoda simge için bir grup, yazılar için başka bir grup ve ikisini çevreleyen bir üst grup olabilir. İki veya üç bilinçli Ungroup işlemi normaldir. Çizim dağılana kadar tıklamak normal değildir. İhtiyaç duyduğunuz parçalar seçilebilir hâle gelir gelmez durun.

Bileşik yol ayrı görünür ama tek nesne gibi davranır

“O” harfi, halka şekli ve içinden negatif boşluk çıkarılmış bir logo genellikle bileşik yollardır. Görünen delik, üstüne yerleştirilmiş beyaz bir nesne değildir. Birden fazla alt yol ve yolun dolgu kuralıyla oluşur; SVG yol belirtimi, halka delikleri gibi yapılar için bileşik yolları açıkça destekler.

Bu yapı kullanışlıdır. Çizim hareket ettiğinde veya renk değiştirdiğinde harf içi boşlukları ve kesilerek çıkarılan alanları korur. Parçalara ayırmak delikleri doldurabilir, adacıkları ayırabilir veya kesicinin iç ve dış olarak yorumladığı alanları değiştirebilir. Açıklık zaten kapanmışsa daha fazla yol komutu uygulamadan önce dolmuş delik teşhisini kullanın.

Parçalara gerçekten ihtiyacınız varsa:

  • önce nesneyi çoğaltın;
  • Release Compound Path, Break Apart veya eşdeğer komutu kullanın;
  • ardından her deliği ve harf içi boşluğu inceleyin;
  • hedef uygulama tek bir temiz siluet gerektiriyorsa bileşik yapıyı geri kurun.

Bir kesim dosyasında parçaları ayırmak kendiliğinden bir iyileştirme değildir. Mevcut bileşik yol doğru kesiliyorsa olduğu gibi bırakın.

Tek bir yolun içinde açığa çıkarılacak bir şey yoktur

Bir yol karmaşık bir siluetin etrafında kıvrılabilir ve yine de tek nesne olabilir. Düğüm veya doğrudan seçim aracına geçin. Konturun tamamı boyunca düğümler görünüyorsa zaten düzenlenebilir geometriye bakıyorsunuz demektir.

Artık seçenekleriniz gruplama işlemleri değil, yol işlemleridir:

  • konturu yeniden şekillendirmek için düğümleri taşıyın;
  • yolu seçtiğiniz düğümlerden kesin;
  • şekli başka bir yolla bölün;
  • yol birbirinden kopuk alt yollar içeriyorsa Break Apart kullanın;
  • vektörleştirme sonucu çok pürüzlüyse belirli bir bölümü yeniden çizin.

Bu ayrım otomatik vektörleştirilmiş çizimlerde önemlidir. Bir dönüştürücü, insanın tanıdığı her nesne için değil, her renk için bir şekil oluşturabilir. Mavi bir gömlek ile mavi bir göz, aynı dolguyu paylaştıkları için tek bir bileşik nesneye dönüşebilir. Dosya vektördür, ancak yapısı beklediğiniz anlamsal katmanlarla örtüşmez.

Rive'da animasyon için yolları serbest bırakmadan veya birleştirmeden önce hangi parçaların bağımsız hareket etmesi gerektiğine karar verin. SVG içe aktarımı yerel Rive nesneleri oluşturur; bu nedenle oluşan Hierarchy yapısını inceleyin ve bir parçanın hareketini deneyin. Rive SVG içe aktarma hazırlık rehberi, kaynaktaki gruplama ve boyama ayarlarını içe aktarılan parçalarla, desteklenmeyen efektlerle ve animasyon için gereken dönme merkezleriyle ilişkilendirir.

SVG tek bir raster görüntü içerebilir

SVG'nin bir <image> öğesi içermesine izin verilir. SVG Embedded Content belirtimi, bu öğenin raster PNG veya JPEG içeriğine başvurabileceğini söyler. Dıştaki dosyanın uzantısı .svg olsa da içindeki çizim hâlâ piksellerden oluşur.

Üç hızlı kontrol yapabilirsiniz:

  1. Yakınlaştırın. Kenarlarda pikseller belirginleşiyorsa seçili içerik rasterdır.
  2. SVG'yi bir metin düzenleyicisinde açın. <image, data:image, .png veya .jpg arayın.
  3. Nesne türünü inceleyin. Düzenlenebilir düğümü olmayan dikdörtgen bir görüntü nesnesi, vektör şekillerden oluşan bir grup değildir.

Orijinal PNG, JPG veya çizim dosyası hâlâ mevcutsa SVG'nin ekran görüntüsünü vektörleştirmeyin. Bulabileceğiniz en temiz kaynağı kullanın. Her dışa aktarma ve ekran görüntüsü, ölçekleme bulanıklığı veya sıkıştırma bozulmaları ekleyebilir.

PerfectVector bu durumda yardımcı olabilir: görüntüden vektöre dönüştürme özelliği, uygun düz renkli çizimleri düzenlenebilir yollar olarak yeniden oluşturabilir. İçerik bir fotoğrafsa, bilinçli olarak sadeleştirilmiş bir vektör görünümü hedeflemediğiniz sürece raster olarak bırakın. Bir fotoğraf, yalnızca SVG içinde bulunduğu için temiz bir anlamsal katman kümesine dönüşmez.

Bu kapsayıcı tuzağı hakkında daha fazla bilgi için hâlâ pikselli görünen SVG rehberine bakın.

Peki kırpma yolları, maskeler ve semboller?

Bazı dosyalar vektördür ama yine de normal grup çözme işlemine direnç gösterir:

  • Kırpma yolu, bir nesnenin bir bölümünü silmeden gizler. Geometrinin tamamını açığa çıkarmak için kırpmayı serbest bırakın, ardından kırpılmış parçaların kalıp kalmaması gerektiğine karar verin.
  • Maske, açık ve koyu değerlerle görünürlüğü kontrol eder. Serbest bırakılması beklenmedik çizimleri açığa çıkarabilir veya saydamlığı değiştirebilir.
  • Sembol veya bağlantılı örnek, doğrudan düzenlemeden önce Expand, Detach ya da Convert to Paths komutu gerektirebilir.
  • Kilitli katman, SVG yapısı değil, düzenleyici durumudur. Dosyayı teşhis etmeden önce kilidini açın.

Görünüm zaten doğruysa ve yalnızca dosyayı yeniden boyutlandırmanız veya yerleştirmeniz gerekiyorsa bu yapılar olduğu gibi kalmalıdır. Her şeyi genişletmek, küçük ve düzenli bir SVG'nin bakımını çok daha zorlaştırabilir.

Güvenli bir düzeltme sırası

Önce yapıya en az zarar veren işlemi kullanın:

  1. Bir kopya kaydedin.
  2. Nesnenin veya katmanın kilidini açın.
  3. Katman panelinde nesne türünü inceleyin.
  4. Grup olduğu doğrulanan nesnenin grubunu çözün.
  5. Kırpma veya maskeyi yalnızca sorun gizli geometriyse serbest bırakın.
  6. Bileşik yolu yalnızca parçaları ayrı ayrı düzenlenmek zorundaysa parçalara ayırın.
  7. Tek bir yolun grubunu çözmeye çalışmak yerine onu düzenleyin veya bölün.
  8. Yalnızca dosya pikseller ya da kullanılamaz geometri içeriyorsa ve orijinal raster mevcutsa yeniden vektörleştirin.

Bu sıra, sebebin bunlar olduğunu anlayana kadar delikleri, örtüşmeleri ve katman ilişkilerini korur.

Teslim ettiğiniz dosyalarda sorunu nasıl önlersiniz?

Bir SVG'yi başka birine göndermeden önce:

  • kaynak belgede önemli grupları ve katmanları adlandırın;
  • ana dosyada düzenlenebilir metni korurken metni yalnızca teslim kopyasında dış hatlara dönüştürün;
  • alıcı düzenlenebilir vektör şekiller bekliyorsa raster gömmekten kaçının;
  • görünüm ile düzenlenebilirliğin karıştırılmaması için bir önizleme PNG'si ekleyin;
  • dışa aktarılan SVG'yi ikinci bir düzenleyicide açıp birkaç parçasını seçin;
  • alıcıya dosyanın katmanlı mı, düzleştirilmiş mi yoksa bilinçli olarak tek bir bileşik şekil mi olduğunu söyleyin.

Dosyayı satın aldıysanız indirme paketini saklayın. İlk açtığınız SVG düzleştirilmiş olsa bile oluşturucusu katmanlı bir SVG, DXF, EPS veya kaynak dosya eklemiş olabilir.

Sık sorulan sorular

SVG'm için Ungroup neden gri görünüyor? Seçili nesne muhtemelen bir grup değildir. Tek bir yol, bileşik yol, görüntü, kırpma veya kilitli nesne olabilir. Layers ya da Objects panelini kontrol edin ve nesne türüne uyan komutu kullanın.

SVG'm neden tek nesne olarak içe aktarılıyor? Tek bir bileşik yol olarak dışa aktarılmış, her renk için bir şekil olarak oluşturulmuş, kaynak uygulama tarafından düzleştirilmiş veya içinde raster görüntüyle kaydedilmiş olabilir. Tek nesne olması dosyanın mutlaka bozuk olduğu anlamına gelmez; değiştirmeden önce düğümlerini ve kaynak işaretlemesini inceleyin.

Cricut Design Space'te tek katmanlı bir SVG'yi nasıl ayırırım? Tek renk ve tek yol ise Design Space'te açığa çıkarılacak gizli katman yoktur. SVG'yi yeniden içe aktarmadan önce çizimi bir vektör düzenleyicisinde ayırın, orijinal katmanlı kaynağa dönün veya renk bölgelerini yeniden oluşturun.

Inkscape veya Illustrator'da bir SVG'nin grubunu çözebilir miyim? Evet, seçim gerçek bir grupsa çözebilirsiniz. Inkscape ve Illustrator ayrıca bileşik yollar, kırpma yapıları ve yol bölme için komutlar sunar. Bu komutlar farklı yapıları çözer ve Ungroup'un daha güçlü sürümleri olarak değerlendirilmemelidir.

PerfectVector gömülü bir görüntüyü düzenlenebilir hâle getirebilir mi? PerfectVector, düz renkli bir logo, simge veya illüstrasyon gibi uygun kaynaklarda orijinal raster çizimi vektörleştirerek vektör yollara dönüştürebilir. Orijinal tasarımcının adlandırılmış katmanlarını veya düzenlenebilir metnini geri getirmez; fotoğrafları ise genellikle raster görüntü olarak bırakmak daha iyidir.

Kaynaklar

  1. W3C — SVG Document Structure — <g> kapsayıcısı ve iç içe gruplama modeli.
  2. W3C — SVG Paths — yollar, birbirinden kopuk alt yollar ve bileşik yol geometrisi.
  3. W3C — SVG Embedded Content — SVG <image> öğeleri içinde raster PNG ve JPEG içeriği.
  4. MDN — SVG clipping and masking — kırpma ile maske arasındaki davranış farkı.
  5. Cricut — Image uploads: unsupported items — bir hedef uygulamanın kırpma yollarını, metni, bağlantılı görüntüleri ve gömülü rasterları nasıl ele aldığı.

Aynı devre dışı komutla uğraşmayı sürdürmeyin. Önce yapıyı belirleyin. SVG'nin bir kapsayıcı içindeki piksellerden oluştuğu anlaşılırsa orijinal çizimi düzenlenebilir vektör yollar olarak yeniden oluşturun, ardından devam etmeden önce sonucu inceleyin.

Bloga daha fazlası

Düzenlemesi daha kolay,
daha temiz bir SVG ile başlayın