lcbrq/magento2-googlemap

A Magento 2 module for Google Map embeed

Add Google Map to any place of your Magento 2 store

Usage

Declare:, _(*1)

<block class="LCB\GoogleMap\Block\Render" name="map" as="map" template="map.phtml"/>, _(*2)

in your layout xml, _(*3)

and <?php echo $this->getChildHtml('map'); ?>, _(*4)

in your template file., _(*5)

Example for contact_index_index.xml, _(*6)

<referenceContainer name="content" htmlClass="row contact-page" htmlTag="div">
    <block class="Magento\Contact\Block\ContactForm" name="contactForm" template="Magento_Contact::form.phtml">
        <block class="LCB\GoogleMap\Block\Render" name="map" as="map" template="map.phtml"/>
    </block>
</referenceContainer>

Configuration

, _(*7)

You can as well use following syntax on any page:, _(*8)

<div id="map"></div>
<script type="text/javascript">// <![CDATA[
    var apiKey = '<GOOGLE_MAPS_API_KEY>';
    require([
        'LCB_GoogleMap/js/map'
    ], function (map) {
        map.render(
                document.getElementById('map'),
                latitude,
                longitude,
                zoom
                );
    });
    // ]]>
</script>

Known issues

Lack of map width and height. Add:, _(*9)

#map {
    min-width: 640px;
    min-height: 320px;
}

to your stylesheet., _(*10)