Show HN: Three.js ile yapılmış futbol pas görselleştirme aracı

 (statsbomb-3d-viz.vercel.app)
1 puan yazan GN⁺ 2024-07-30 | 1 yorum | WhatsApp'ta paylaş
  • Etkinlik seçilmedi
  • Filtre uygula
  • Filtreyi temizle
  • Kamerayı sıfırla
  • StatsBomb 3D görselleştirme aracı
  • StatsBomb etkinlik verisi dosyasının URL'sini yapıştır
  • Veriyi yükle
  • Örneği yükle
  • Örnek: @c_mnzs / gh: @carlos-menezes

GN⁺ özeti

  • Bu araç, StatsBomb etkinlik verilerini 3D olarak görselleştirme işlevi sunuyor
  • Kullanıcılar, etkinlik verisi dosyasının URL'sini girerek veriyi yükleyebiliyor
  • Filtre uygulama veya temizleme özellikleri sayesinde istenen veriler seçilebiliyor
  • Kamerayı sıfırlama özelliğiyle görselleştirilen veriler başlangıç durumuna döndürülebiliyor
  • Bu araç, veri analizi ve görselleştirmeyle ilgilenen kişiler için faydalı olabilir

İlgili okumalar

1 yorum

 
GN⁺ 2024-07-30
Hacker News yorumları

  • Ücretsiz verilerle harika şeyler yapıldığını görmek her zaman güzel. Kendiniz denemek isterseniz binlerce ücretsiz futbol maçı verisi var.
    https://github.com/statsbomb/open-data
    Futbol verileri arasında Lionel Messi'nin tüm maçlarının yeniden toplanmış hâli de var; Amerikan futbolunda da Tom Brady için aynı çalışmaya başlanmış.
    https://github.com/statsbomb/amf-open-data

    • 2015 civarında StatsBomb ve Twitter'daki daha geniş ağ sayesinde programlamaya başlamıştım.
    • Gerçekten ilginç. Zaten Tom Brady'nin tüm touchdown'larını kendim izlediğim benzer bir çalışma yapıyorum, bu yüzden Tom Brady verilerine göz atmam gerekecek.
      Veri görselleştirme tarafında daha ayrıntılı verilere ihtiyacım vardı ama iş yükü epey büyük.
      [1] https://tombradytds.com
      [2] https://tombradytds.com/viz.php

  • Arayüz harika. Başka bir şeyle değiştirmek isteyenler için yönergeleri izleyip ham JSON'u kendileri bulabilirler, bu yüzden hazır bir örnek sunmanız iyi olur.
    Yükledikten sonra three.js'i neden kullandığınızı pek anlayamadım. Çünkü pas yüksekliğini de heatmap olarak gösteriyor. whoscored'un pas rotaları daha sezgisel görünüyor.

  • Çok güzel. 2D görselleştirmeleri seviyorum. Birkaç yıl önce https://pubg.sh yapmıştım; telemetri formatı aslında oldukça benzer.
    Profesyonel PUBG takımlarının aracımı maç sonrası analiz için kullandığını biliyorum; profesyonel futbol takımlarının da benzer iç araçları olup olmadığını merak ediyorum. İzlenip görselleştirilebilecek gerçekten çok fazla unsur olmalı.

    • PUBG'yi çok oynadığım dönemlerde bu uygulamayı birkaç kez kullanmıştım. Tanıştığıma sevindim.

  • İyi iş çıkarmışsınız. Diğer yorumlara bakınca bu projeyi seçme nedenlerinizden biri three.js öğrenmekmiş gibi görünüyor; yine de deck.gl veya kepler.gl de değerlendirilebilir.
    Bunlar daha üst seviye görselleştirme temel bileşenleri sunuyor ve büyük veri kümeleri için performans optimizasyonları var. Farklı görselleştirme yöntemlerini denemek veya birkaçını üst üste bindirmek de daha kolay olabilir.
    İki paket de çok hızlı prototipleme sağlıyor. kepler.gl ile kod yazmadan kabaca bir mockup bile oluşturmak mümkün olabilir; bu yaklaşımı denemek büyük bir iş yükü gerektirmeyebilir.

  • Harika. Paylaştığınız için teşekkürler. Zaman tabanlı animasyon eklenebilir mi? Renklerin yavaşça solduğu bir şekilde maçın ilerleyişini görmek isterdim.
    Ayrıca bu veriden içgörü çıkarmanın en iyi yolunun ne olacağını da merak ediyorum. Keşif ilk adım gibi hissettiriyor ama bunun üzerine değer katılabilirse gerçekten iyi olur.

  • Renklerin ne anlama geldiğini merak ediyorum. Sadece tamamlanan paslar var, kesilen paslar eksik gibi görünüyor? Tek tek vektörler yerine pas heatmap'i göstermek farklı bir bakış açısı sunabilir.
    Pas yönünü başlangıç/bitiş noktalarıyla veya çok karmaşık olmazsa oklarla göstermeyi düşünüp düşünmediğinizi merak ediyorum. Pas hızı gösterimi olup olmadığını da merak ediyorum.
    Oyuncu veya takım bazında özet istatistikler de mümkün olabilir: pas sayısı, ortalama hız, başarı oranı, kadro içindeki yoğunlaşma/dağılım düzeyi, topu en çok/en az alan oyuncular, en çok/en az hangi oyunculardan top alan oyuncular, pozisyona göre istatistikler vb. Fikirlerim bu kadar. Güzel görselleştirme.

    • Çekirdek motor hazır olduğuna göre artık geriye işi yapmak kalıyor. Fikirler için teşekkürler.

  • Çizgi renklerinin nasıl belirlendiğini bilmiyorum ama takım ve belirli bir oyuncuya göre filtreleyince çizgiler neredeyse görünmüyor; bizzat arayıp bulmak gerekiyor.

  • "Load Example" ne yaptığını anlamak için çok faydalıydı. Güzel bir iş. Renklerin ne anlama geldiğinin açıklanması isteğine de katılıyorum.
    Canlı maç kamera görüntüsüyle birleştirilirse oldukça güçlü olabilir[0]. Maç sırasında ayrıntıları vurgulamak gibi.
    [0] https://x.com/skalskip92/status/1816461263829889238

  • Güzel görünüyor. Pasları zaman sırasına göre oynatmak mümkün olsa maçın akışını hissetmek mümkün olabilir.

  • Bir dosya yüklemeyi denedim ama başarısız oldu. Birkaç URL biçimi denedim.
    https://github.com/statsbomb/open-data/…
    https://github.com/statsbomb/open-data/…
    15956.json
    Giriş alanında beklenen biçime dair örnek önceden yer alsa veya dosyanın neden yüklenemediğini hata mesajı daha iyi açıklasa iyi olurdu. Sorunun URL'imden mi yoksa içeriden mi kaynaklandığını anlamak zor.
    Yine de çok ilginç bir demo ve airstrike'ın önerdiği gibi(https://news.ycombinator.com/item?id=41096570) çekirdek motor hazır olduğundan daha fazla filtre gelirse çok daha ilginç hâle gelebilir.