GolfOne Socket — POC

Socket server สำหรับสนามกอล์ฟ — รับตำแหน่งรถกอล์ฟแบบ real-time แล้วตอบรายการรถคันอื่นในรัศมี
หน้านี้รวมตัวอย่างหน้าจอทั้งหมด เพื่อดูว่า contract ที่ออกแบบไว้เอาไปวาดหน้าจอได้จริง

จำลอง · ไม่ต้องต่อ server

ตัวอย่างหน้าจอ Android

หน้าจอบนรถกอล์ฟ — วงโซนแดง/เหลือง/เขียว, รายการรถที่อยู่ใกล้เป็นหลา, หลุมปัจจุบันและระยะถึงกรีน

จำลอง · ไม่ต้องต่อ server

ตัวอย่างหน้าจอ Web Monitor

ภาพรวมทั้งสนาม — กลุ่มรถที่กระจุกกันพร้อมรัศมีและจำนวน เรียกขอข้อมูลใหม่ทุก 5 วินาที

ต่อ server จริง

ทดสอบ flow จริง

ขอ token → ต่อ socket → ส่งตำแหน่ง → ดูรถคันอื่น ต้องรัน server พร้อม PostgreSQL และ Redis

2 หน้าแรกทำงานยังไง

ทั้งสองหน้ายัง ไม่ได้ต่อ socket จริง เพราะ server ยังไม่ implement contract ใหม่ (ตารางหลุม / คะแนน / user ของ web ยังไม่มา) จึงใช้ engine จำลองใน demo/golf-demo.js ที่สร้าง response ตาม contract เป๊ะๆ พร้อมรถ 52 คันวิ่งบนสนาม 18 หลุม

เวลา server พร้อม ให้เปลี่ยนแค่จุดที่เรียก GolfDemo.updateLocation() / GolfDemo.siteOverview() เป็น SignalR invoke จริง — โค้ดส่วนวาดไม่ต้องแก้เลย เพราะรับ JSON โครงเดียวกัน

ไม่ใช้ map API — พื้นสนามวาดด้วย SVG แล้วฉาย lat/lng ลงไปตรงๆ
เคล็ดลับคือตั้ง viewBox ให้หน่วยเป็น หลา ค่า radius_yards ที่ server ส่งมาจึงใช้เป็นรัศมีวงกลมได้ทันที ไม่ต้องแปลงหน่วยอีก
ถ้าภายหลังอยากได้ภาพถ่ายดาวเทียมจริง สลับไปใช้ Leaflet + OpenStreetMap ได้ (ฟรี ไม่ต้องใช้ key)

ค่าที่ใช้ในตัวอย่าง

ในระบบจริงค่าเหล่านี้มาจาก "GPS"."SystemConfiguration" ไม่ได้ hard-code ในแอป

Keyค่าใช้ทำอะไร
zone_danger_to_yards150วงแดง
zone_warning_to_yards250วงเหลือง
search_radius_yards300วงเขียว + รัศมีค้นหาสูงสุด
density_radius_yards150รัศมีจับกลุ่มความหนาแน่น
density_warning_carts5กลุ่มเริ่มเป็นสีเหลือง
density_danger_carts10กลุ่มเป็นสีแดง

เอกสาร

docs/04-socket-protocol.mdcontract ของทั้ง 2 hub
docs/08-density-clustering.mdalgorithm จับกลุ่ม + ผลทดสอบความนิ่ง
docs/mock/*.jsonตัวอย่าง response สำหรับทีม Android / web