Geolocation คือ Web API ภายใต้มาตรฐาน HTML5 คุณสามารถใช้เพื่อรับข้อมูลตำแหน่งปัจจุบัน (พิกัด) ของอุปกรณ์ได้ API นี้มีสามวิธี: getCurrentPosition, watchPosition และ clearWatch เหลืออีก 2 วิธีต้องใช้ร่วมกัน!
วิธีใช้:การตรวจสอบความเข้ากันได้ของเบราว์เซอร์:
API ได้รับการเผยแพร่ผ่านวัตถุ navigator.geolocation เท่านั้นที่สามารถใช้บริการระบุตำแหน่งทางภูมิศาสตร์ได้
if (navigator.geolocation) { // เขียนโค้ดตำแหน่งที่นี่} else { การแจ้งเตือน ('เบราว์เซอร์ของคุณไม่รองรับตำแหน่งทางภูมิศาสตร์')}รับตำแหน่งปัจจุบันของผู้ใช้:
ใช้เมธอด getCurrentLocation เพื่อรับข้อมูลตำแหน่งของผู้ใช้ วิธีนี้มีพารามิเตอร์สามตัว:
| รายการพารามิเตอร์ | พิมพ์ | แสดงให้เห็น |
| จัดการความสำเร็จ | การทำงาน | ฟังก์ชั่นการโทรจัดการความสำเร็จเมื่อประสบความสำเร็จ |
| จัดการข้อผิดพลาด | การทำงาน | ตัวจัดการฟังก์ชันการโทรเกิดข้อผิดพลาดเมื่อล้มเหลว |
| ตัวเลือก | วัตถุ | พารามิเตอร์การเริ่มต้น |
// พารามิเตอร์การเริ่มต้น const options = { // ความแม่นยำสูง: true / false EnableHighAccuracy: true, // เวลาสูงสุดที่จะรอหน่วยตอบสนอง: หมดเวลามิลลิวินาที: 5 * 1,000, // ตำแหน่งแคชที่ยาวที่สุดที่แอปพลิเคชันยินดียอมรับเวลา maximumAge: 0}// ฟังก์ชันการเรียกกลับที่สำเร็จ: ข้อมูลมีข้อมูลตำแหน่ง const handleSuccess = data => console.log(data)// ฟังก์ชันการเรียกกลับที่ล้มเหลว: ข้อผิดพลาดมีข้อมูลข้อผิดพลาด const handleError = ข้อผิดพลาด => console.log(error)if (navigator.geolocation) { // รหัสตำแหน่งถูกเขียนไว้ที่นี่ navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options)} else { alert('Geolocation is not support in your browser') }นี่คือรหัสพร้อมรายละเอียดเพิ่มเติม:
const handleSuccess = data => { const { coords, // การประทับเวลาข้อมูลตำแหน่ง // การประทับเวลาเมื่อได้รับข้อมูลตำแหน่งสำเร็จ} = ข้อมูล const { ความแม่นยำ, // ความแม่นยำของผลลัพธ์ที่ส่งคืน (เมตร) ระดับความสูง, // สัมพันธ์กับแนวนอน ความแม่นยำของระดับความสูงของเครื่องบิน // ส่งกลับส่วนหัวของความแม่นยำในระดับความสูง (เมตร) // ทิศทางการเดินทางของอุปกรณ์โฮสต์ตามเข็มนาฬิกาจากละติจูดเหนือ // ละติจูดลองจิจูด // ความเร็วลองจิจูด // ความเร็วในการเคลื่อนที่ของอุปกรณ์} = coords // พิมพ์ออกมาและดู console.log('timestamp =', timestamp) console.log('accuracy =',ความแม่นยำ) console.log('altitude =', altitude) console .log( 'altitudeAccuracy =', altitudeAccuracy) console.log('heading =', heading) console.log('latitude =', latitude) console.log('longitude =', ลองจิจูด) console.log('speed =', speed)}const handleError = error => { switch (error.code) { กรณีที่ 1: console.log ('คำขอบริการตำแหน่งถูกปฏิเสธ') กรณีที่ 2: console.log (' The ไม่สามารถรับข้อมูลตำแหน่งได้ชั่วคราว') กรณีที่ 3: console.log ('หมดเวลาเพื่อรับข้อมูล') กรณีที่ 4: console.log ('ข้อผิดพลาดที่ไม่รู้จัก') แบ่ง }} const opt = { // ความแม่นยำสูง: จริง / เท็จ EnableHighAccuracy: จริง // เวลาสูงสุดในการรอการตอบสนอง หน่วย: มิลลิวินาทีหมดเวลา: 5 * 1,000, // อายุสูงสุดของตำแหน่งแคชที่แอปพลิเคชันยินดียอมรับ maximumAge: 0} if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(handleSuccess , handleError, opt) } else { alert('เบราว์เซอร์ของคุณไม่รองรับตำแหน่งทางภูมิศาสตร์')}ข้างต้นคือเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการศึกษาของทุกคน ฉันหวังว่าทุกคนจะสนับสนุน VeVb Wulin Network