Блог

Мне нужно знать, как я могу показать это map на своем веб-сайте, не нажимая на кнопку, что мне нужно изменить в этом коде?

 <div style="margin-top:-5px" class="collapse" id="collapseMap">
    <?php if($appModule == "tours"){ ?>
    <iframe id="mapframe" width="354" height="580" style="position: static;" src="" frameborder="0"></iframe>
    <script>
        $('#collapseMap').on('shown.bs.collapse', function(e){
            $("#mapframe").prop("src","<?php echo base_url();?>tours/tourmap/<?php echo $module->id; ?>");
        });
    </script>
    <?php }else{ ?>
    <div id="map" class="map"></div>
    <br>
    <script>
        $('#collapseMap').on('shown.bs.collapse', function(e) {
            (function(A) {
                if (!Array.prototype.forEach)
                    A.forEach = A.forEach || function(action, that) {
                        for (var i = 0, l = this.length; i < l; i  )
                            if (i in this) action.call(that, this[i], i, this);
                    }
            })(Array.prototype);
            var mapObject, markers = [],
                markersData = {
                    'marker': [{
                        name: '<?php echo character_limiter($module->title, 80);?>',
                        location_latitude: <?php echo $module->latitude;?>,
                        location_longitude: <?php echo $module->longitude;?>,
                        map_image_url: '<?php echo $module->thumbnail;?>',
                        name_point: '<?php echo character_limiter($module->title, 80);?>',
                        description_point: '<?php echo character_limiter(strip_tags(trim($module->desc)),100);?>',
                        url_point: '<?php echo $module->slug;?>'
                    }, <?php foreach($module->relatedItems as $item):?> {
                        name: 'hotel name',
                        location_latitude: "<?php echo $item->latitude;?>",
                        location_longitude: "<?php echo $item->longitude;?>",
                        map_image_url: "<?php echo $item->thumbnail;?>",
                        name_point: "<?php echo $item->title;?>",
                        description_point: '<?php echo character_limiter(strip_tags(trim($item->desc)),100);?>',
                        url_point: "<?php echo $item->slug;?>"
                    }, <?php endforeach;?>]
                };
            var mapOptions = {
                zoom: 14,
                center: new google.maps.LatLng(<?php echo $module->latitude;?>, <?php echo $module->longitude;?>),
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                mapTypeControl: !1,
                mapTypeControlOptions: {
                    style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
                    position: google.maps.ControlPosition.LEFT_CENTER
                },
                panControl: !1,
                panControlOptions: {
                    position: google.maps.ControlPosition.TOP_RIGHT
                },
                zoomControl: !0,
                zoomControlOptions: {
                    style: google.maps.ZoomControlStyle.LARGE,
                    position: google.maps.ControlPosition.TOP_RIGHT
                },
                scrollwheel: !1,
                scaleControl: !1,
                scaleControlOptions: {
                    position: google.maps.ControlPosition.TOP_LEFT
                },
                streetViewControl: !0,
                streetViewControlOptions: {
                    position: google.maps.ControlPosition.LEFT_TOP
                },
                styles: []
            };
            var marker;
            mapObject = new google.maps.Map(document.getElementById('map'), mapOptions);
            for (var key in markersData)
                markersData[key].forEach(function(item) {
                    marker = new google.maps.Marker({
                        position: new google.maps.LatLng(item.location_latitude, item.location_longitude),
                        map: mapObject,
                        icon: '<?php echo base_url(); ?>uploads/global/default/'   key   '.png',
                    });
                    if ('undefined' === typeof markers[key])
                        markers[key] = [];
                    markers[key].push(marker);
                    google.maps.event.addListener(marker, 'click', (function() {
                        closeInfoBox();
                        getInfoBox(item).open(mapObject, this);
                        mapObject.setCenter(new google.maps.LatLng(item.location_latitude, item.location_longitude))
                    }))
                });

            function hideAllMarkers() {
                for (var key in markers)
                    markers[key].forEach(function(marker) {
                        marker.setMap(null)
                    })
            };

            function closeInfoBox() {
                $('div.infoBox').remove()
            };

            function getInfoBox(item) {
                return new InfoBox({
                    content: '<div class="marker_info" id="marker_info">'   '<img style="width:280px;height:140px" src="'   item.map_image_url   '" alt="<?php echo character_limiter($module->title, 80);?>"/>'   '<h3>'   item.name_point   '</h3>'   '<span>'   item.description_point   '</span>'   '<a href="'   item.url_point   '" class="btn btn-primary"><?php echo trans('
                    0177 ');?></a>'   '</div>',
                    disableAutoPan: !0,
                    maxWidth: 0,
                    pixelOffset: new google.maps.Size(40, -190),
                    closeBoxMargin: '0px -20px 2px 2px',
                    closeBoxURL: "<?php echo $theme_url; ?>assets/img/close.png",
                    isHidden: !1,
                    pane: 'floatPane',
                    enableEventPropagation: !0
                })
            }
        });
    </script>
    <?php } ?>
</div>
<!-- map -->
  

Без щелчка? Вы имеете в виду при загрузке страницы?

Если это так, то вы можете показать свой сворачиваемый элемент следующим образом. Это должно быть помещено после вашего исходного определения сворачиваемого элемента и / или изменено на соответствующий элемент, к которому вы, возможно, попытаетесь обратиться:

 <script>

    $(function() {
        var collapsible = $('#collapseMap');

        collapsible.each(function() {
            $(this).collapse('show');
        });
    });

</script>
  

Попробуйте удалить

 $('#collapseMap').on('shown.bs.collapse', function(e){
  

и

 });
  

из обеих частей скрипта.