เทคโนโลยีจำลองของไหลด้วย WebGL

 (paveldogreat.github.io)
2 คะแนน โดย GN⁺ 2024-12-30 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • เป็น แอปจำลองของไหล ที่รันได้ทันทีในเบราว์เซอร์ โดยผู้ใช้สามารถปรับคุณภาพการเรนเดอร์และค่าที่เกี่ยวข้องกับการคำนวณทางฟิสิกส์ได้
  • สามารถปรับพารามิเตอร์การจำลอง เช่น density diffusion, velocity diffusion, pressure, vorticity, splat radius โดยมี quality และ sim resolution เป็นค่าหลัก
  • เอฟเฟกต์ภาพแบ่งเป็น shading, colorful, Bloom และ Sunrays โดย Bloom และ Sunrays มีค่ารายละเอียดแยกต่างหาก
  • ควบคุมลำดับการทำงานด้วย paused และ Random splats และจัดการสีพื้นหลัง·พื้นหลังโปร่งใส·ภาพหน้าจอในส่วน Capture
  • มีรายการไปยัง Github, Twitter, Discord และแอปมือถือวางไว้ร่วมกัน เพื่อไปยังทรัพยากรภายนอกของการจำลอง

รายการปรับแต่งการจำลอง

  • หน้า WebGL Fluid Simulation ให้หน้าจอสำหรับรัน การจำลองของไหล พร้อมข้อความแนะนำ “Try Fluid Simulation app!”
  • รายการพื้นฐานที่ผู้ใช้ปรับได้:
    • quality
    • sim resolution
  • ค่าการจำลองประกอบด้วยรายการต่อไปนี้:
    • density diffusion
    • velocity diffusion
    • pressure
    • vorticity
    • splat radius

การทำงานและเอฟเฟกต์หน้าจอ

  • ตัวเลือกที่เกี่ยวข้องกับการทำงาน:
    • เช็กบ็อกซ์ shading
    • เช็กบ็อกซ์ colorful
    • เช็กบ็อกซ์ paused
    • Random splats
  • การตั้งค่า Bloom:
    • เช็กบ็อกซ์ enabled
    • intensity
    • threshold
  • การตั้งค่า Sunrays:
    • เช็กบ็อกซ์ enabled
    • weight

การจับภาพและรายการภายนอก

  • การตั้งค่า Capture:

    • background color

      • เช็กบ็อกซ์ transparent
      • take screenshot
      • ด้านล่างมีรายการ Github, Twitter, Discord และ mobile app

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2024-12-30
ความคิดเห็นบน Hacker News

  • ผมลอง fork สิ่งนี้แล้วกลับโมเดลแสงจาก การผสมแบบบวก เป็น การผสมแบบลบ จู่ ๆ มันก็เริ่มดูเหมือนหมึกในน้ำ
    https://observablehq.com/@tomlarkworthy/ink

    • ตอนที่ผมสร้างซิมูเลชันของไหล สิ่งแรกที่ทำก็อันนี้เหมือนกัน ผมขุดคุ้ยมานานว่าจะทำอย่างไรให้ได้ เอฟเฟกต์สีแบบลบ ในผลงานดิจิทัล หรือก็คือความอิ่มลึกของเม็ดสีและความรู้สึกที่เปลี่ยนไปตามแสง แต่ส่วนใหญ่ไม่ค่อยได้ผล ถึงอย่างนั้นพอมีโอกาสก็ยังอดลองไม่ได้
    • จะยากแค่ไหนถ้าจะทำให้หมึกไม่หายไป? ผมอยากลองรวมมันเข้ากับแอปวาดรูป ถ้ามีทิปส์อะไรจะช่วยได้มากจริง ๆ
    • อาจลองพิจารณาเปลี่ยนหมึกเป็น สี CMYK ด้วย: mutable ink = [255, 0, 255]

  • ไม่รู้ว่าทำไม แต่ทุกครั้งที่เห็น ซิมูเลชันฟิสิกส์ หรือวิชวลเอฟเฟกต์ความละเอียดสูงแบบนี้ ผมจะรู้สึกได้ชัดที่สุดเลยว่าใน CPU/GPU มีการประมวลผลเกิดขึ้นมากแค่ไหน
    ก่อนหน้านี้วันนี้ผมดูวิดีโอ 2 นาทีจากมุมมองห้องนักบิน ที่ประกาศภาวะฉุกเฉินแล้วนำเครื่องเข้ารันเวย์สนามบิน กว่าจะถึงช่วงท้ายถึงเพิ่งรู้ว่ามันไม่ใช่วิดีโอจริง แต่เป็นซิมูเลเตอร์หรือวิดีโอเกม แต่ถึงอย่างนั้น การเห็นสีที่หมุนวนบนหน้าจอก็ยังส่งผลกับผมแรงกว่าอยู่ดี แปลกดี

  • ในบรรดาการทำแบบเก่า ๆ ผมผูกพันกับเวอร์ชันนี้เสมอ ที่ความละเอียดต่ำมันมีสุนทรียะเหมือน ไซเบอร์พังก์เน็ตรันเนอร์ ส่วนที่ความละเอียดสูงมันให้ความรู้สึกแทบจะเหมือนวิญญาณล่องลอย: https://haxiomic.github.io/projects/webgl-fluid-and-particle...

    • น่าสนใจดี มีคอมเมนต์ปี 2020 ที่ผู้สร้างโปรเจกต์นั้นพูดถึงโปรเจกต์นี้ด้วย ผมสงสัยมาตลอดว่าทั้งสองเชื่อมโยงกันอย่างไร หรือแค่เอาแนวคิดตั้งต้นเดียวกันไปประยุกต์ใช้แยกกัน: https://news.ycombinator.com/item?id=24065857
    • ผมชอบตั้งเป็น คุณภาพ UltraHigh แล้วปรับ solver iterations เป็น 1 เพื่อเล่นกับมัน มันทำให้นึกถึงตอนทำอาหารที่ค่อย ๆ ผสมวัตถุดิบหนึ่งเข้ากับอีกอย่าง เช่น ตอนทำพาสต้าแล้วผสมแป้งลงในไข่

  • มีใครรู้ตัวอย่าง ซิมูเลชันน้ำ ที่ทำด้วย WebGL เพิ่มอีกไหม? ผมกำลังหาวิธีทำคลื่นที่มีฟอง
    ผมชอบเดโม Pool ของ Evan
    https://madebyevan.com/webgl-water/

    • เคยอ่านจากที่ไหนสักแห่งว่า อันนั้นไม่ใช่ซิมูเลชัน แต่เป็น ทริกอันชาญฉลาด ที่ทำให้ดูเหมือนน้ำ สระว่ายน้ำ และวัตถุในนั้นมากกว่า

  • ถ้าสนใจการเรนเดอร์ของไหล Sebastian Lague เพิ่งทำวิดีโอเกี่ยวกับเรื่องนี้: https://www.youtube.com/watch?v=kOkfC5fLfgE

    • วิดีโอของ Lague น่าทึ่งและสร้างแรงบันดาลใจอย่างสม่ำเสมอ ขอแนะนำอย่างยิ่งสำหรับคนที่สนใจด้านนี้

  • บน oimo.io ก็มี ซิมูเลชันของไหล WebGL อยู่หลายตัวที่ถูกพูดถึงในเธรดนี้
    https://news.ycombinator.com/item?id=37026592 - Water (2023-08-06, 133 comments)
    https://oimo.io/works/water/
    https://oimo.io/works/water3d/
    https://oimo.io/works/fluid/

  • ดูเหมือนสิ่งนี้จะปล่อย HDR ได้จริงบน iPhone 15 Pro ของผม กรณีแบบนี้ไม่ค่อยมีบ่อย ทำให้หน้าจอดูมีชีวิตชีวาขึ้นมาก
    เจ๋งมากจริง ๆ

    • ดูดีและลื่นมากก็จริง แต่ แอปพลศาสตร์ของไหลแบบสมัครสมาชิก เนี่ยนะ เอาจริงเหรอ?

  • นี่เป็นครั้งแรกที่ผมรู้สึกขอบคุณ หน้าจอสัมผัส ของแล็ปท็อปอย่างแท้จริง

  • นึกถึง Plasma Pong เลย
    ถ้ามีคนทำเวอร์ชันออนไลน์ฟรีขึ้นมาคงน่าเสียดายแย่เลย ;)

  • https://news.ycombinator.com/item?id=19963640
    https://news.ycombinator.com/item?id=23955527