Laravel с магазином Bjorn jquery store

Question

Прежде чем я начну использовать Laravel, я использовал этот скрипт для своего локатора магазина, обычно он работает все время, но, к сожалению, когда я начинаю использовать его в Laravel, карта не отображается, контейнер показывает только Информационные окна на данный момент.

карта не отображается

Я обнаружил, что мой iframe от Google не определен, когда я уже вставляю свой ключ API Google. Кто-нибудь знает, как это случилось? Меня беспокоит несколько часов.

https://www.bjornblog.com/web/jquery-store-locator-plugin

Google API checker показывает, что API работает, но карта не показывает

apichecker

После исходного кода для моего проекта

Footer.blade.php

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="{{ asset('js/libs/handlebars.min.js') }}"></script>

<script src="https://maps.google.com/maps/api/js?key=AIzaSyDlkvi61_Xxxxxxxxxxxxxxxxxxx"></script>

<script src="{{ asset('js/plugins/storeLocator/jquery.storelocator.js') }}"></script>

вызвать скрипт:

<script>
$(document).ready(function () {
    $('#bh-sl-map-container').storeLocator({
        'slideMap': false,
        'fullMapStart': true,
        'disableAlphaMarkers': true,
        'storeLimit': -1,
        'dataType': 'json',
        'dataLocation': '{{ asset("js/plugins/storeLocator/templates/data/data.json") }}',
        'nameSearch': true,
        'infowindowTemplatePath': '{{ asset("js/plugins/storeLocator/templates/infowindow-description.html") }}',
        'listTemplatePath': '{{ asset("js/plugins/storeLocator/templates/location-list-description.html") }}',
        'KMLinfowindowTemplatePath': '{{ asset("js/plugins/storeLocator/templates/kml-infowindow-description.html") }}',
        'KMLlistTemplatePath': '{{ asset("js/plugins/storeLocator/templates/kml-location-list-description.html") }}',
        'lengthUnit': 'km',
        'distanceAlert': -1,
        'mapSettings': {
            zoom: 8,
            scrollwheel: true,
        },
        infoBubble: {
            backgroundClassName: 'bh-sl-window',
            backgroundColor: '#fff',
            borderRadius: 30,
            borderWidth: 0,
            closeSrc: '{{ asset("js/assets/img/close-icon-dark.png") }}',
            disableAutoPan: false,
            shadowStyle: 1,
            padding: 20,
            maxWidth: 200,
            arrowSize: 10,
        }
    });
});
</script>

storelocator.blade.php:

<div class="outlet-map">
        <div id="bh-sl-map-container" class="bh-sl-map-container">
                <div id="bh-sl-map" class="bh-sl-map"></div>
                <div class="bh-sl-loc-list">
                  <ul class="list"></ul>
                </div>
              </div>
</div>

Надеюсь, кто-нибудь может мне помочь: (