Google Map Blue-Dot用于reactjs中的当前位置

Question

我正在实现google maps。我想要当前位置的默认google蓝点。任何人都可以在reactjs或简单的javascript中告诉如何做到这一点。

Answer 1

首先，您必须允许浏览器将地理位置发送到Google API，然后在窗口/文档加载事件中连接此代码：

var map, infoWindow;
function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
        center: { lat: -34.397, lng: 150.644 },
        zoom: 6
    });
    infoWindow = new google.maps.InfoWindow;

    // Try HTML5 geolocation.
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            var pos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude
            };

            infoWindow.setPosition(pos);
            infoWindow.setContent('Location found.');
            infoWindow.open(map);

            var marker = new google.maps.Marker({
                position: pos,
                map: map,
                title: 'Hello World!',
                icon: 'https://maps.google.com/mapfiles/kml/shapes/info-i_maps.png',
            });

            map.setCenter(pos);
        }, function () {
            //handleLocationError(true, infoWindow, map.getCenter());
        });
    } else {
        // Browser doesn't support Geolocation
        //handleLocationError(false, infoWindow, map.getCenter());
    }
}