Show HN: Tarayıcıda 3D bitki simülasyonu

 (plant.max-richter.dev)
3 puan yazan GN⁺ 2023-12-04 | 1 yorum | WhatsApp'ta paylaş
  • Plantarium, tarayıcıda 3D bitkileri düğümlerle birleştiren bir sistemdir ve tamamlanmış bir bitki oluşturmak için bir output node gerekir
  • Bitkinin temel iskeletini Stem düğümü oluşturur; origin, height, thiccness, minThiccness, amount girdileriyle gövdenin konumu, yüksekliği, kalınlığı ve sayısı ayarlanır
  • Değerlerin tekrarı ve varyasyonu Vec3 ve Parameter düğümleri tarafından sağlanır; varsayılan değerlere rastgele değişimler eklenerek bitkinin daha az uniform görünmesi sağlanır
  • Biçim değişikliği Rotate, Gravity, Noise düğümleriyle kontrol edilir; döndürme ekseni ve açısı, yerçekimi yöntemi, gürültü boyutu ve şiddeti girilir
  • Yapraklar Leaf, Shape, Instance düğümleriyle oluşturulur ve gövde veya dallar boyunca yerleştirilir; boyut, aralık, sayı, döndürme ve derinlik koşulları belirtilebilir

Düğüm grafiğinin nihai çıktısı

  • Tüm düğüm sistemleri, nihai sonucu üretmek için tek bir output düğümüne ihtiyaç duyar
  • output, plant girdisini alarak tüm bitki sonucunu oluşturur

Gövde oluşturma ve konum kontrolü

  • Stem düğümü bitkinin temel gövdesini oluşturur
    • _origin_: gövdenin yerleştirileceği konumdur; bir vec3 düğümü bağlanabilir
    • height: gövde yüksekliği
    • thiccness: gövde kalınlığı
    • minThiccness: minimum kalınlık
    • _amount_: örneklenecek gövde sayısı
  • Vec3 düğümü x, y, z değerlerini çıktı olarak verir
    • Gövdeleri dağıtarak yerleştirmek için random veya parameter düğümü bağlanabilir

Değer varyasyonu ve rastgelelik

  • Parameter düğümü, temel değere belirli bir rastgele varyasyon uygulanan bir değer çıktılar
    • _value_: varyasyon uygulanacak temel değer
    • _variation_: temel değere uygulanacak varyasyon miktarı
  • Parameter, gövde, döndürme, yerçekimi, eğrilik ve kaydırıcı değerleri gibi birçok girdide tekrar tekrar kullanılır

Döndürme, yerçekimi ve gürültüyle biçim değiştirme

  • Rotate düğümü bitkiyi belirtilen eksen ve açı kadar döndürür
    • input: döndürülecek hedef
    • _axis_: döndürme ekseni
    • _aroundOrigin_: 0,0,0 noktasına göre döndürülüp döndürülmeyeceği
    • smooth: yumuşak döndürmeyle ilgili girdi
    • _spread_: birden çok nesne bağlıysa tek parça olarak mı yoksa dağıtarak mı döndürüleceğini belirler
    • _angle_: döndürme açısı
  • Gravity düğümü dallara ve gövdelere basit yerçekimi uygular
    • input: yerçekimi uygulanacak hedef
    • curviness: eğrilik derecesi
    • _type_: yerçekimi hesaplama yöntemi; şu anda yalnızca simple ve test çalışır
    • strength: yerçekimi şiddeti
  • Noise düğümü giriş dalına gürültü uygular
    • plant: giriş bitkisi
    • size: gürültü boyutu
    • strength: gürültü şiddeti

Yaprak oluşturma ve gövdeye yerleştirme

  • Leaf düğümü yaprak modelini oluşturur; Instance düğümüyle gövde boyunca örneklenebilir
    • _shape_: tekil yaprağın şeklidir; bir shape düğümü bağlanabilir
    • _curvature_: yaprağın x/y yönündeki eğriliğidir; bir vec2 düğümü bağlanabilir
  • Shape düğümü, Leaf düğümüne bağlanabilen tek bir şekil çıktılar
  • Instance düğümü giriş modelini gövde veya dal boyunca yerleştirir
    • input: yerleştirme için referans girdi
    • model: yerleştirilecek model
    • alignRotation: döndürme hizalaması
    • alternateRotation: dönüşümlü döndürme
    • _size_: tekil yaprağın boyutu
    • _instanceRange_: örneklerin yerleştirileceği aralık
    • _amount_: yerleştirilecek yaprak sayısı
    • rotation: döndürme değeri
    • offsetBySize: boyuta göre ofset
    • _depth_: yaprakların kaç dal katmanına yerleştirileceğini belirtir
  • Alpha min, max değerlerine sahiptir

İlgili okumalar

1 yorum

 
GN⁺ 2023-12-04
Hacker News yorumları

  • Birçok açıdan gerçekten kullanışlı ve harika.
    Tarayıcı tabanlı düğüm grafiği düzenleyicisi iyi yapılmış; prosedürel 3D mesh oluşturabiliyor, .obj dışa aktarma bile var ve lisansı da esnek olduğu için çeşitli prosedürel araçların tohumu olabilecek gibi görünüyor.

    • Çok teşekkürler :)
      Bu araçla denenebilecek çok fikir var; muhtemelen lisans tezimi bunun üzerine yazacağım.

  • Karmaşıklığı etkileyici.
    Hızlıca kurcalamak isteyenler için eğitim de iyi ama ilginç kısma gelmek birkaç dakika sürdüğünden, sağ paneldeki kaydırıcıları ayarlayıp eğrelti otunun nasıl değiştiğine bakmak iyi olur.
    Ayrıca library’ye basıp başka modeller yükleyince neler yapılabileceği hemen anlaşılıyor.
    Kullanıcıların gönderdiği modeller arasında henüz şaka amaçlı bir model olmaması, projenin gerçekten daha yeni çıktığını hissettiriyor.

    • Şu an evin dışındayım, PC’ye erişimim yok ama gönderinin epey ilgi çektiğini az önce gördüm.
      Umarım dayanır ;)

  • Çok iyi görünüyor ama küçük bir sorun var.
    Değerleri değiştirirken bitkinin formu değiştikçe kamera sürekli yeniden hizalanıyor; bu da kamera titriyormuş gibi görünüyor ve şahsen oldukça rahatsız edici.
    Parametreleri değiştirirken kamerayı sabitleyebilsek güzel olurdu.

    • İyi geri bildirim.
      Kameranın otomatik ortalamasına debounce eklemek iyi olabilir :)
    • Değişiklikten sonra kararlı hale geldiğinde kamera hareketini animasyonla yapmak da iyi görünüyor.

  • Harika bir proje ama şu anda bitkiler render edilmiyor gibi.
    20 dakika önce render ediliyordu; muhtemelen HN trafiğinden etkilenmiş.
    Kodun tamamı çevrimiçi ve dokümantasyon da mükemmel. Hatta bu projenin bir sunucu backend’i de var.
    https://github.com/jim-fx/plantarium/tree/main
    https://github.com/jim-fx/plantarium/blob/main/ARCHITECTURE....
    Birkaç gün sonra geri gelip çalışırken bakacağım.

    • Yeniden hayata döndü.

  • Bir yıl önce Rust’ı web uygulaması motoru olarak denemek istediğim için benzer bir şey yapmıştım.
    wasm’e derleyip bir Rust web sunucusunda yayımlıyordum; sonuç https://blomma.lorentz.app adresinde.
    Ancak bu proje ürünleştirme açısından çok daha iyi; özellikle düğüm grafiği düzenleyicisi gerçek güçlü yanı.
    İş akışına iyi entegre olduğu için bir hata ayıklama aracından öte, herkesin kullanabileceği bir ürün gibi hissettiriyor.
    Benim tarafta daha iyi olan bir şey varsa, hem yaprak şekli hem de gövde şekli için Bézier eğrileri kullanmam olabilir.
    Topolojiyi ve üçgenlemeyi doğru oturtmak epey zordu ama kuaterniyonlara giriş ve trigonometri tekrarı için çok iyi oldu. Bir Bézier eğrisi düğümü denemenizi öneririm.

    • Gerçekten harika! Güzel sözler için de teşekkürler :)
      Geometri üreticisini Rust/Wasm ile yeniden yazmak yol haritasında oldukça ciddi şekilde yer alıyor.
      Şimdilik Advent of Code yaparak Rust’a alışıyorum.

  • Müthiş havalı! Gövde thiccness parametresini sevdim :)

    • Teşekkürler :)
      Programcıların kendi projelerini ya da kendilerini fazla ciddiye alma eğiliminde olduğunu düşünüyorum; bu yüzden aralara biraz oyunculuk katmayı seviyorum.

  • Gerçekten çok hoşuma gitti!
    Kullanılabilirliği iyileştirmek için birkaç önerim var.
    Birincisi, fareyi yanlışlıkla kutunun dışına taşıyıp bırakırsanız sürükleme davranışı hatalı çalışıyor. mouse-up algılanmadığı için parametre mouse-down durumunda stuck kalıyor.
    Yaprak düzenleyicide çizim yapmak veya kaydırıcı gibi sürükleyerek parametre değiştirmek zorlaşıyor. Muhtemelen mouse-up event handler’ını grafik düğümü düzenleyici kutusuna değil, ortak bir üst öğeye kaydetmek yeterli olur.
    İkincisi, bağlantıları sürüklemeye yarayan küçük parametre port dairesel tutamaçları biraz küçük. Özellikle sahnenin büyük kısmını görecek kadar uzaklaştırdığınızda daha da öyle.
    Grafik öğesinin kendisini değil, sadece hit area’yı %25 kadar büyütmek bile kullanılabilirliği artırabilir.
    Not olarak Firefox kullanıyorum. Chromium’da da mouse handler sorunu aynı şekilde oluyor; ancak düğüm bağlantısı sürükleme Chromium’da biraz daha kullanılabilir görünüyor.

    • Geri bildirim için teşekkürler!
      Bu tür küçük kullanılabilirlik hatalarına insan kendi başına körleşebiliyor, o yüzden çok değerli.
      İkisi de birkaç gün içinde düzelir gibi :)

  • Bilmeyenler için: Sağ panel, daha fazla parametre ve kontrolü göstermek üzere kaydırılabiliyor.

  • Harika.
    Kitle kaynaklı algoritmik bitkilerle bütün bir ormanın oluştuğunu görmeyi sabırsızlıkla bekliyorum.
    Bir bilim projesiyle bağlantılı mı? Bitkinin hayatta kalma olasılığının ne kadar olduğunu, en yakın taksonomik karşılığının ne olduğunu ve beyaz pilavın yanında iyi gidecek tarifleri söyleyen bir yapay zekalı botanikçi özelliği de güzel olurdu.

    • Fikirlerimden biri, bitkilerin büyüdüğü ve kullanıcının onlara Tamagotchi gibi bakması gereken sanal bir bahçe yapmak :)
      Bir bilim projesiyle bağlantılı değil; sadece bitkileri seven bir nerd tarafından yapıldı.
      Yine de projeye gbif.org ID’si ekleyebiliyorsunuz; böylece gbif API üzerinden ek bilgiler yükleniyor :)

  • Harika! Bir time düğümü de eklenebilirse temel animasyonlar mümkün olabilir gibi.
    Genel olarak çok sevimli bir proje.

    • İyi fikir!
      Zor kısım, her karede tüm mesh’i yeniden oluşturmadan animasyonu nasıl entegre edeceğimiz olacak gibi.
      Yine de üreticiden skeleton dışa aktarıp bitkiyi onunla canlandırmak oldukça kolay olur gibi görünüyor.