{"id":24102178,"url":"https://github.com/intummadee/google_map_agent","last_synced_at":"2026-05-09T23:47:05.549Z","repository":{"id":271540033,"uuid":"913780644","full_name":"Intummadee/google_map_agent","owner":"Intummadee","description":null,"archived":false,"fork":false,"pushed_at":"2025-02-26T05:18:00.000Z","size":1406,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-26T06:19:43.004Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Intummadee.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-01-08T10:41:36.000Z","updated_at":"2025-02-26T05:18:03.000Z","dependencies_parsed_at":"2025-01-08T11:38:21.937Z","dependency_job_id":"594e8ced-cfde-4483-b921-5bb2e600d136","html_url":"https://github.com/Intummadee/google_map_agent","commit_stats":null,"previous_names":["intummadee/google_map_agent"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Intummadee%2Fgoogle_map_agent","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Intummadee%2Fgoogle_map_agent/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Intummadee%2Fgoogle_map_agent/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Intummadee%2Fgoogle_map_agent/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Intummadee","download_url":"https://codeload.github.com/Intummadee/google_map_agent/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241055820,"owners_count":19901661,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-01-10T17:36:26.981Z","updated_at":"2026-05-09T23:47:05.541Z","avatar_url":"https://github.com/Intummadee.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\n# google_map_agent\n\n## Backend\n```\ncd .\\backend\\\npython -m venv env\n.\\env\\Scripts\\activate\npip install -r requirements.txt\n```\n\n- ถ้าโหลดไรมาใน backend ให้เข้า env แล้วพิมตัวนี้\npip freeze \u003e requirements.txt\n\n**คำสั่งรัน**\n```uvicorn main:app --host 127.0.0.1 --port 8000```\n\n\n---\n\n## Frontend\n```\ncd .\\my-frontend\\\nnpm install\n```\n\n**คำสั่งรัน** \n```npm start```\n\n\n\n\n\nที่ต้องทำ\n- ปักหมุด สถานีบนลาดกระบัง\n- กำหนดให้สุ่มใน ลาดกระบัง\n- คำนวณ path ตาม backend\n- ทำ route เพิ่ม by a* \n- ค่อยนำมาเทียบกัน\n\n\n\n\u003c!-- streamlit run app.py --\u003e\nenv\\Scripts\\activate \nstreamlit run app.py\n\n# อธิบาย\nfolium → ใช้สร้างแผนที่\nstreamlit → ใช้ทำอินเทอร์เฟซแบบเว็บ\nrandom → ใช้สุ่มตำแหน่งเริ่มต้นและปลายทาง\nheapq → อาจใช้สำหรับ A* ในอนาคต (แต่ตอนนี้ไม่ได้ใช้)\njson → แปลงตำแหน่งตัวแทนเป็น JSON สำหรับใช้ใน JavaScript\nstreamlit.components.v1 → ใช้ฝัง HTML และ JavaScript ลงใน Streamlit\n\n\n\n\n\n# ปัญหา\n    \n## วิธีแก้ไขปัญหา มันโชว์หลายเฟรม\n1. ใช้ JavaScript ใน Folium\n- ใช้ folium.plugins.TimestampedGeoJson หรือ folium.plugins.MarkerCluster เพื่ออัปเดตตำแหน่งของ Marker แบบต่อเนื่อง\n- ใช้ JavaScript เพื่อเคลื่อนย้าย Marker โดยไม่ต้องสร้างแผนที่ใหม่ทุกครั้ง\n\n2. ใช้ Streamlit กับ HTML/JS Components\n- ใช้ st.components.v1.html() เพื่อฝัง JavaScript ที่อัปเดตตำแหน่ง Marker ตามข้อมูลที่ส่งมาจาก Python\n\n\n## วิธีแก้ปัญหา มันสร้าง Marker ใหม่เรื่อยๆ ให้เหมือนเป็นการเคลื่อนไหว real-time แต่มันไม่ลบ Marker เก่า\n- ใช้ JavaScript เพื่ออัปเดตตำแหน่ง Marker ที่มีอยู่แทนการสร้างใหม่\n- อัปเดตตำแหน่ง Marker โดยใช้ **setLatLng()** แทนการสร้าง Marker ใหม่\n- เมื่อ Marker เคลื่อนที่ไปตำแหน่งใหม่ ตำแหน่งเก่าจะถูก**ลบอัตโนมัติ**\n- ใช้ setTimeout() ใน JavaScript เพื่ออัปเดต Marker ทุก 500ms\n\n\n---\n\n\n- สถานี (Stations) ที่ fix ไว้\n- Agent แต่ละคนที่มีเส้นทางเดิน (Route) โดยใช้ A* คำนวณระหว่างสถานี\n- การ animate marker โดยอัปเดตตำแหน่งของ agent ในแต่ละ timestep บนแผนที่เดียว (เหมือนวิดีโอ)\n- สุ่มตำแหน่งเริ่มต้นและปลายทางของ agent จากนั้นเลือกสถานีที่ใกล้ที่สุดเพื่อคำนวณเส้นทาง\n- เส้นทางของ agent จะประกอบด้วย จุดเริ่มต้น, สถานีต้นทาง, เส้นทางจาก A* (ระหว่างสถานี), และจุดปลายทาง\n\n\n# รอทำ 🫧𓇼𓏲*ੈ✩‧₊˚🎐\n- เปรียบความสัมพันธ์ระหว่าง a* , cbs\n- แก้โครงงาน\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fintummadee%2Fgoogle_map_agent","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fintummadee%2Fgoogle_map_agent","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fintummadee%2Fgoogle_map_agent/lists"}