Google Maps Street View серого цвета (выдает ошибку b .hasAttribute не является функцией)

Question

Я реализовал (в VueJs 2) карты Google с пользовательским маркером.Пока все работает хорошо, как и ожидалось.

У меня проблема в том, что когда я перетаскиваю парня с видом на улицу на карту и отпускаю ее, моя карта становитсясерый, и я получаю следующие ошибки в инструментах разработчика

И это мой код / ​​метод для карт Google

showMap() {
    const initMap = gmapsInit();
    initMap.then((google) => {
        let myLatLng = {lat: this.latitude, lng: this.longitude};
        let map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            center: myLatLng
        });

        let contentString = '<div id="content">' +
            '<div id="siteNotice">' +
            '</div>' +
            '<h1 id="firstHeading" class="firstHeading">' + this.locationTranslations.name + '</h1>' +
            '<div id="bodyContent">' +
            '<p>' + this.description + '</p>' +
            '</div>' +
            '</div>';

        let infowindow = new google.maps.InfoWindow({
            content: contentString
        });

        let icon = {
            url: '/static/img/map-pin.svg',
            scaledSize: new google.maps.Size(30, 30),
        };

        let marker = new google.maps.Marker({
            position: myLatLng,
            icon: icon,
            map: map,
            title: this.locationTranslations.name
        });
        marker.addListener('click', function () {
            infowindow.open(map, marker);
        });

        countryService.getClientLocation()
            .then((response) => {
                let locationCoordinates = response.data.loc.split(",");
                this.userLocation.lat = parseFloat(locationCoordinates[0]);
                this.userLocation.lng = parseFloat(locationCoordinates[1]);

                let directionsService = new google.maps.DirectionsService;
                let directionsDisplay = new google.maps.DirectionsRenderer;
                directionsDisplay.setMap(map);
                directionsService.route({
                    origin: myLatLng,
                    destination: this.userLocation,
                    travelMode: 'DRIVING'
                }, function (response, status) {
                    if (status === 'OK') {
                        directionsDisplay.setDirections(response);
                    } else {
                        this.$snotify.warning(
                            'Please allow location tracking, so we can show you directions to location',
                            this.$t('warn')
                        );
                    }
                });

            })


    }).catch((e) => {
        console.log(e);
    });
},

Может некоторыеодин, пожалуйста, помогите мне, что мне не хватает или что я делаю неправильно, чтобы моя карта могла отображать улицу?Если вам нужна дополнительная информация, пожалуйста, дайте мне знать, и я предоставлю.Спасибо!

Answer 1

Похоже, что на вас повлияло переключение версий API Карт Javascript, я бы посоветовал вам использовать версию 3.34 в качестве обходного пути, вы можете сделать это, добавив параметр v в тег сценария API JavaScript Javascript.может увидеть образец ниже:

<script async defer
  src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&v=3.34&callback=initMap">
</script>