Skip to content
This repository was archived by the owner on Sep 20, 2019. It is now read-only.

Commit c30e5d1

Browse files
authored
Merge pull request #264 from elesdoar/master
feat(center): add url-hash-param, URL param for center
2 parents 7d8dd2f + 0664847 commit c30e5d1

File tree

11 files changed

+133
-15
lines changed

11 files changed

+133
-15
lines changed

dist/ui-leaflet.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* ui-leaflet 1.0.0 2016-06-08
2+
* ui-leaflet 1.0.0 2016-06-13
33
* ui-leaflet - An AngularJS directive to easily interact with Leaflet maps
44
* git: https://github.com/angular-ui/ui-leaflet
55
*/
@@ -3292,8 +3292,9 @@ centerDirectiveTypes.forEach(function (directiveName) {
32923292
var extractCenterFromUrl = function extractCenterFromUrl() {
32933293
var search = $location.search();
32943294
var centerParam;
3295-
if (isDefined(search.c)) {
3296-
var cParam = search.c.split(":");
3295+
var centerKey = attrs.urlHashParam ? attrs.urlHashParam : 'c';
3296+
if (isDefined(search[centerKey])) {
3297+
var cParam = search[centerKey].split(":");
32973298
if (cParam.length === 3) {
32983299
centerParam = {
32993300
lat: parseFloat(cParam[0]),

dist/ui-leaflet.min.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/ui-leaflet.min.no-header.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/ui-leaflet_dev_mapped.js

Lines changed: 4 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/ui-leaflet_dev_mapped.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
<!DOCTYPE html>
2+
<html ng-app="demoapp">
3+
<head>
4+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
5+
<script src="../bower_components/angular/angular.min.js"></script>
6+
<script src="../bower_components/leaflet/dist/leaflet.js"></script>
7+
<script src="../bower_components/angular-simple-logger/dist/angular-simple-logger.js"></script>
8+
<script src="../dist/ui-leaflet.min.js"></script>
9+
<link rel="stylesheet" href="../bower_components/leaflet/dist/leaflet.css" />
10+
<script>
11+
var app = angular.module('demoapp', ['ui-leaflet']);
12+
app.controller('CustomCenterUrlHashController', [ '$scope', '$location', function($scope, $location) {
13+
angular.extend($scope, {
14+
london: {
15+
lat: 51.505,
16+
lng: -0.09,
17+
zoom: 4
18+
}
19+
});
20+
$scope.$on("centerUrlHash", function(event, centerHash) {
21+
console.log("url", centerHash);
22+
$location.search({ center: centerHash });
23+
});
24+
25+
$scope.changeLocation = function(centerHash) {
26+
$location.search({ center: centerHash });
27+
};
28+
29+
}]);
30+
</script>
31+
<style>
32+
input {
33+
width: 120px;
34+
margin-right: 10px;
35+
}
36+
</style>
37+
</head>
38+
<body ng-controller="CustomCenterUrlHashController">
39+
<leaflet lf-center="london" url-hash-center="yes" url-hash-param="center" width="100%" height="480px"></leaflet>
40+
<h1>Center map with URL synchronization example</h1>
41+
<p>This demo syncs the map center position with the URL, and vice versa, using the <strong>url-hash-center</strong> and <strong>url-hash-param</strong> property.</p>
42+
<ul>
43+
<li><input type="number" step="any" ng-model="london.lat" /> Latitude</li>
44+
<li><input type="number" step="any" ng-model="london.lng" /> Longitude</li>
45+
<li><input type="number" step="any" ng-model="london.zoom" /> Zoom</li>
46+
</ul>
47+
<h2>Direct locations</h2>
48+
<ul>
49+
<li><a href="" ng-click="changeLocation('36.8899:-121.8008:12')">Watsonville</a>
50+
<li><a href="" ng-click="changeLocation('34.0078:-118.8060:14')">Malibu</a>
51+
<li><a href="" ng-click="changeLocation('33.7717:-117.9458:12')">Garden Grove</a>
52+
<li><a href="" ng-click="changeLocation('32.5290:-117.0442:13')">Tijuana</a>
53+
</ul>
54+
</body>
55+
</html>

examples/js/controllers.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -965,6 +965,22 @@ var app = angular.module('webapp');
965965
});
966966
});
967967
}]);
968+
app.controller('CustomCenterUrlHashController', [ '$scope', '$location', function($scope, $location) {
969+
angular.extend($scope, {
970+
london: {
971+
lat: 51.505,
972+
lng: -0.09,
973+
zoom: 4
974+
}
975+
});
976+
$scope.$on("centerUrlHash", function(event, centerHash) {
977+
console.log("url", centerHash);
978+
$location.search({ center: centerHash });
979+
});
980+
$scope.changeLocation = function(centerHash) {
981+
$location.search({ center: centerHash });
982+
};
983+
}]);
968984
app.controller("GeoJSONCenterController", [ '$scope', '$http', 'leafletData', function($scope, $http, leafletData) {
969985
angular.extend($scope, {
970986
japan: {
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
app.controller('CustomCenterUrlHashController', [ '$scope', '$location', function($scope, $location) {
2+
angular.extend($scope, {
3+
london: {
4+
lat: 51.505,
5+
lng: -0.09,
6+
zoom: 4
7+
}
8+
});
9+
$scope.$on("centerUrlHash", function(event, centerHash) {
10+
console.log("url", centerHash);
11+
$location.search({ center: centerHash });
12+
});
13+
$scope.changeLocation = function(centerHash) {
14+
$location.search({ center: centerHash });
15+
};
16+
}]);

examples/json/examples.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -225,6 +225,16 @@
225225
"title": "Bounds Nominatim map example"
226226
}
227227
],
228+
"custom": [
229+
{
230+
"date": "2016-06-13T22:25:52.099Z",
231+
"section": "custom",
232+
"onlyStandAlone": false,
233+
"id": "/custom/center-url-hash-example",
234+
"extUrl": "0127-custom-center-url-hash-example.html",
235+
"title": "Center map with URL synchronization example"
236+
}
237+
],
228238
"layers": [
229239
{
230240
"date": "2015-11-03T15:15:10.774Z",

src/directives/center.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,9 @@ centerDirectiveTypes.forEach(function(directiveName) {
8181
var extractCenterFromUrl = function() {
8282
var search = $location.search();
8383
var centerParam;
84-
if (isDefined(search.c)) {
85-
var cParam = search.c.split(":");
84+
var centerKey = attrs.urlHashParam? attrs.urlHashParam:'c';
85+
if (isDefined(search[centerKey])) {
86+
var cParam = search[centerKey].split(":");
8687
if (cParam.length === 3) {
8788
centerParam = {
8889
lat: parseFloat(cParam[0]),

0 commit comments

Comments
 (0)