Question

我在网站上使用Google Maps API做了两件事：

首先显示地图：

jQuery(document).ready(function($) {
function initialize_business() {    
            var map_move = $(document).width() > 850 ? true : false;   
            var map_center = new google.maps.LatLng(parseFloat($('#business_sidebar_map').attr('data-lat')), parseFloat($('#business_sidebar_map').attr('data-lng')));
            var map_options = {
                zoom: 14,
                center: map_center,
                zoomControl: false,
                scaleControl: false,
                draggable: false,
                scrollwheel: false,
                mapTypeControl: false,
                streetViewControl: false,
            };
            var map = new google.maps.Map(document.getElementById('business_sidebar_map'), map_options);

            new google.maps.Marker({
                position: map_center,
                map: map,          
                icon: js_string.template_directory + '/images/marker.png'  
            });     
        }

        google.maps.event.addDomListener(window, 'resize', initialize_business);
        google.maps.event.addDomListener(window, 'load', initialize_business);  

});

对于这张地图，我需要下一个api链接：

<script src="https://maps.googleapis.com/maps/api/js"></script>

其次，我使用Google Map API从我的地址中找到GPS：

function google_geocoding() {
    var autocomplete = new google.maps.places.Autocomplete(document.getElementById('address'), {
        types: ['geocode'],
        componentRestrictions: {country: 'cz'},
    });
    autocomplete.addListener('place_changed', function() {
        var place = autocomplete.getPlace();
        if (!place.geometry) {
            window.alert('Bohužel jsme nanašli žádnou lokaci');
            return;
        }
        document.getElementById('address_lat').value = place.geometry.location.lat();
        document.getElementById('address_lng').value = place.geometry.location.lng();
    });

}

对于这个事件，我需要下一个api链接：

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&region=cz&callback=google_geocoding"></script>

在控制台中我看到下一个错误：

您已在此页面上多次添加Google Maps API。

所以我可能需要将Google脚本链接组合到一个，但我不知道如何。

感谢您的帮助

Answer 1

我找到解决方案：

调用google maps API一次

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&region=cz">

Inscted of callback param I simple调用函数使最终脚本为：

jQuery(document).ready(function($) {
    if($('#business_sidebar_map').length > 0) {
        function initialize_business() {    
            var map_move = $(document).width() > 850 ? true : false;   
            var map_center = new google.maps.LatLng(parseFloat($('#business_sidebar_map').attr('data-lat')), parseFloat($('#business_sidebar_map').attr('data-lng')));
            var map_options = {
                zoom: 14,
                center: map_center,
                zoomControl: false,
                scaleControl: false,
                draggable: false,
                scrollwheel: false,
                mapTypeControl: false,
                streetViewControl: false,
            };
            var map = new google.maps.Map(document.getElementById('business_sidebar_map'), map_options);

            new google.maps.Marker({
                position: map_center,
                map: map,          
                icon: js_string.template_directory + '/images/marker.png'  
            });     
        }

        google.maps.event.addDomListener(window, 'resize', initialize_business);
        google.maps.event.addDomListener(window, 'load', initialize_business);  
    }

    if($('#address').length > 0) {
        function google_geocoding() {
            var autocomplete = new google.maps.places.Autocomplete(document.getElementById('address'), {
                types: ['geocode'],
                componentRestrictions: {country: 'cz'},
            });
            autocomplete.addListener('place_changed', function() {
                var place = autocomplete.getPlace();
                if (!place.geometry) {
                    window.alert('Bohužel jsme nanašli žádnou lokaci');
                    return;
                }
                document.getElementById('address_lat').value = place.geometry.location.lat();
                document.getElementById('address_lng').value = place.geometry.location.lng();
            });

            }
            google_geocoding();
        }

    });

如何组合两个Google Maps API

1 个答案: