Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

แสดง HTML5 Geolocation Accuracy บน Google Maps อย่างดีที่สุด

ใช้ Circle Overlay แสดง Radius ความแม่นยำ

var lat = position.coords.latitude;
var lng = position.coords.longitude;
var accuracy = position.coords.accuracy; // เมตร

var center = new google.maps.LatLng(lat, lng);

// Marker ตำแหน่ง
var marker = new google.maps.Marker({
    position: center,
    map: map,
    title: 'Your Location'
});

// Circle ความแม่นยำ
var accuracyCircle = new google.maps.Circle({
    center: center,
    radius: accuracy,
    map: map,
    fillColor: '#0000FF',
    fillOpacity: 0.1,
    strokeColor: '#0000FF',
    strokeOpacity: 0.5,
    strokeWeight: 1
});

// Zoom ให้เห็น Circle ทั้งวง
map.fitBounds(accuracyCircle.getBounds());

position.coords.accuracy เป็น Radius ในเมตร (68% Confidence) Circle แสดงพื้นที่ที่ตำแหน่งจริงอาจอยู่