JSFiddle - React, Tailwind, and code Playground

by Alan Doe

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;signed_in=true&amp;libraries=places"></script>
<div ng-app="geoStuf" class="container">
            <div id="mapCanvas" ng-controller="myCT">
            </div>
        
  </div>

CSS

.container
            {
                width:500px;
                height:350px;
            }
            #mapCanvas
            {
                width:100%;
                height:100%;
            }

JavaScript

function initialize(){
            var mapOptions = {
          center: { lat: -34.397, lng: 150.644},
          zoom: 8
        };
                
        var map = new google.maps.Map(document.getElementById('mapCanvas'),
            mapOptions);
      }
            
      google.maps.event.addDomListener(window, 'load', initialize);


var myApp = angular.module('geoStuf',[]);
       
                function myCT($scope,$http)
            {
                alert('ctrl');
                
                $http.get('demo-project-alanz2223.c9.io/maps').success(function(data,status,headers,config)
                                                                                       {
                    
                    var ps = data;
                    alert(ps);
                    
                
                });
                
                
 }

myApp.controller('myCT',myCT);