Skip to content

Instantly share code, notes, and snippets.

@rsalmond

rsalmond/gist:33250f274a7ff4d78651

Created December 12, 2014 08:22
Show Gist options
  • Save rsalmond/33250f274a7ff4d78651 to your computer and use it in GitHub Desktop.
Save rsalmond/33250f274a7ff4d78651 to your computer and use it in GitHub Desktop.
Download ZIP
async angular google maps loader
Raw
gistfile1.html
<html>
<head>
<meta charset='utf-8'>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-google-maps/2.0.11/angular-google-maps.js"></script>
<title>async angular maps</title>
<style type="text/css">
.angular-google-map-container {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
</style>
<script type="text/javascript">
gmapApp = angular.module('gmapApp', ['uiGmapgoogle-maps'])
.config(function(uiGmapGoogleMapApiProvider) {
uiGmapGoogleMapApiProvider.configure({
// key: 'your api key',
v: '3.17',
libraries: 'weather,geometry,visualization'
});
})
.controller('mainCtrl', function($scope) {
$scope.map = {center: {latitude: 49.25, longitude: -123.1 }, zoom: 13 };
$scope.options = {scrollwheel: true};
});
</script>
</head>
<body ng-app="gmapApp">
<div ng-controller="mainCtrl">
<ui-gmap-google-map center="map.center" zoom="map.zoom" options="options"></ui-gmap-google-map>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment