Magento – How to show embedded google map in magento 2 in phtml file

google-mapmagento2phtml

I am trying to add google map in the frontend. I added embedded google map in phtml. here is my code

<?php
    $contacts_config = $this->getConfig('porto_settings/contacts');
    $_enable = $contacts_config['enable'];
    if($_enable){
        $_apikey = $contacts_config['api_key'];
        $_full_width = $contacts_config['full_width'];
        $_address = $contacts_config['address'];
        $_zoom = $contacts_config['zoom'];
        $_center_lat = $contacts_config['latitude'];
        $_center_lng = $contacts_config['longitude'];
?>
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?<?php if($_apikey): ?>key=<?php echo $_apikey; ?><?php else: ?>v=3.17<?php endif; ?>"></script>
<script type="text/javascript">
    function initialize() {
        var pos = new google.maps.LatLng(<?php echo $_center_lat; ?>, <?php echo $_center_lng; ?>);
        var mapOptions = {
            center: pos,
            panControl: true,
            zoomControl: true,
            mapTypeControl: true,
            scaleControl: true,
            streetViewControl: true,
            overviewMapControl: true,
            zoom: <?php echo $_zoom; ?>
        };
        var map = new google.maps.Map(document.getElementById("store_map"), mapOptions);
        var marker = new google.maps.Marker({
            position: pos,
            map: map,
            title: '<?php echo $_address; ?>'
        });
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>
<?php if(!$_full_width): ?>
<div class="container">
<?php endif; ?>
<iframe src="https://www.google.com/maps/embed?pb" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
<?php if(!$_full_width): ?>
</div>
<?php endif; ?>
<?php
    }
?>

I am getting a map but not for this location.

Best Answer

Use below link, it will solve your purpose. https://developers.google.com/maps/documentation/embed/start

Related Topic