Döşeme altıgen tesselasyonunu nasıl oluşturabilirim (SVG / Web için)?


11

Aşağıdaki görüntüye benzer bir mozaik desende normal altıgenler kullanarak bir web sayfası için bir SVG arka plan görüntüsü oluşturmak istiyorum . Ancak, bu yüzden kullanabilirsiniz altıgenler birbirine bağlamak gerekir:

background-image: url("path-to-hex.svg");

CSS kalıbı. Bunu Inkscape'te yapmak istiyorum. Yine de desen bloklar halinde "kesmek" emin değilim. Bunu yapmaya nasıl başlayabilirim?

altıgenler

EDIT Sonuç gerçekten iyi görünüyordu! çıktı


Inkscape dosyasına bir bağlantı yapıştırabilirseniz yararlı olur!
V-Red

Yanıtlar:


21

Biraz boolean işlem hilesi ile bu oldukça kolay bir işlemdir.

resim açıklamasını buraya girin

Sadece orada bulunan altıgenler kümesini alın, yukarıdaki resimde gördüğüm turuncu olanla eşleşen bir dikdörtgen oluşturun (köşelerin altıgenler üzerindeki uygun noktalara oturduğundan emin olun) ve ardından kavşak aracını kullanın dikdörtgenin dışındaki her şeyden kurtulun. Bu size bölünebilir bir desen bırakmalıdır.

Edit: horatio's yorum (iyi çağrı!) Başına, ben o belirli dikdörtgene nasıl yerleştiğini açıklamak gerektiğini düşündüm. Bir kutucuk oluştururken, deseninizin her bir parçasının adı geçen kutucukta en az bir kez görünmesi gerekir (ve ideal olarak bir kereden fazla olmamalıdır). Bu model ile x veya y ekseninde tekrar eden noktalar olup olmadığını görmek için baktım; Neyse ki benim için altıgenler garip bir açıda oturmuyorlar, bu yüzden bu işleri nispeten kolay bir iş haline getirdi.

resim açıklamasını buraya girin

X ekseninde, hizalı olan iki altıgen seçtim. Bunlar yatay olarak desenin başlangıcı ve bitişi olacaktır. Daha sonra her birinden bir eşleme noktası seçtim (bu durumda, en soldaki nokta). Bu, desen için kırpma dikdörtgeninin tam genişliğini işaretler. Sonra, dikey olarak aynısını yaptım, zaten genişlik için seçmiş olduğum noktaları kullanarak desenin kırpma dikdörtgeninin üst köşeleri gibi. Eşleşen alt noktaları bulduğumda, kırpma dikdörtgeni tanımlandı.

Bu tekniği istediğiniz sayıda şekil üzerinde kullanabilirsiniz. Altıgenler (veya diğer şekiller) üzerinde bir açıda da kullanabilirsiniz, ancak karo açısına bağlı olarak önemli ölçüde büyüyeceğini unutmayın.


2
Dikdörtgen alanı nasıl seçtiğinizin arkasındaki fikri açıklayabilirseniz, OP bunu diğer şekillere genelleştirebilir.
horatio

Güncelleme gerçekten çok iyi. Kavramın açıklanmasına yardımcı olur.
Diyot Dan

Mükemmel! Yardımcı olduğuma sevindim. :)
Chris Langford
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.