Skip to content

Commit 0dbc7ae

Browse files
committed
added dynamic center example
2 parents 25e7987 + d21709a commit 0dbc7ae

File tree

3 files changed

+61
-1
lines changed

3 files changed

+61
-1
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ To Get Started
1818
--------------
1919
For Bower users,
2020

21-
`$ bower install ngMap`
21+
`$ bower install ngmap`
2222

2323
1. Include `ng-map.min.js` as well as google maps.
2424
`<script src="http://maps.google.com/maps/api/js?sensor=false"></script>`

build/map_with_dynamic_center.html

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!DOCTYPE html>
2+
<html ng-app="myApp">
3+
<head>
4+
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
5+
<style id="my-css">
6+
map, div[map] {display:block; width:600px; height:400px;}
7+
</style>
8+
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
9+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
10+
<script src="scripts/plunkr.js"></script>
11+
<script src="scripts/app.js"></script>
12+
<link rel="stylesheet" href="css/styles.css"></script>
13+
<script src="scripts/ng-map.min.js"></script>
14+
<script id="my-js">
15+
app.controller("MyCtrl", function($scope) {
16+
$scope.lat = 40.74, $scope.lng = -74.18;
17+
});
18+
</script>
19+
</head>
20+
21+
<body ng-controller="MyCtrl">
22+
<div id="my-html">
23+
<map center="[{{lat}}, {{lng}}]" />
24+
</div>
25+
<br/>Latigude : <input type="number" ng-model="lat" />
26+
<br/>Longitude : <input type="number" ng-model="lng" />
27+
<div ng-include="'source_code.html'" plunkr></div>
28+
</body>
29+
</html>
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<!DOCTYPE html>
2+
<html ng-app="myApp">
3+
<head>
4+
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
5+
<style id="my-css">
6+
map, div[map] {display:block; width: 600px; height: 400px}
7+
</style>
8+
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
9+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
10+
<script src="scripts/plunkr.js"></script>
11+
<script src="scripts/app.js"></script>
12+
<link rel="stylesheet" href="css/styles.css"></script>
13+
<script src="scripts/ng-map.min.js"></script>
14+
<script id="my-js">
15+
app.controller('MyCtrl', function($scope) {
16+
$scope.lat = 40.74, $scope.lng = -74.18;
17+
});
18+
</script>
19+
</head>
20+
21+
<body ng-controller="MyCtrl">
22+
<div id="my-html" style="width:600px; height:400px">
23+
<map zoom="11" center="[{{lat}}, {{lng}}]">
24+
<marker position="[{{lat}}, {{lng}}]" title="hello"></marker>
25+
</map>
26+
</div>
27+
<br/>Latigude : <input type="number" ng-model="lat" />
28+
<br/>Longitude : <input type="number" ng-model="lng" />
29+
<div ng-include="'source_code.html'" plunkr></div>
30+
</body>
31+
</html>

0 commit comments

Comments
 (0)