Google maps

Small example how to include Google maps into Joomla!

HTML part is simple:

<div id="map-canvas" style="width: 400px; height: 400px"></div>
<script src="https://maps.googleapis.com/maps/api/js"></script>

Note here that I had to add width and height, otherwise maps refuses to show. Also, note that I added Google APIs.

JS:

/*global google*/
(function (){
    "use strict";

    var mapOptions,
        mapCanvas,
        map;

    mapOptions = {
        zoom: 6,
        center: { lat: -34.397, lng: 150.644},
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    mapCanvas = document.getElementById('map-canvas');

    if (!map) {
        map = new google.maps.Map(mapCanvas, mapOptions);
    }

}());