Last active
June 20, 2017 11:23
-
-
Save bubbobne/6275f466c25762ed71fa37ffffa1d15c to your computer and use it in GitHub Desktop.
Ionic double filter on list (leaflet)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
angular.module('doublefilter.example', []).controller('doubleFilterCtrl', function ($scope, $cordovaGeolocation) { | |
$scope.geom=new L.Point(12, 12); | |
$scope.items=[{"lat":10,"lng":5,"property1":"a"},{"lat":0,"lng":6,"property1":"a"},{"lat":14,"lng":5,"property1":"b"}]; | |
$scope.filterValue="a"; | |
}).filter("propertyFilter", function () { | |
return function (items, propertyValue) { | |
var filtered = []; | |
for (var i = 0; i < items.length; i++) { | |
if (items[i].hasOwnProperty("property1") && items[i].property1 == propertyValue) { | |
filtered.push(items[i]); | |
} | |
} | |
return filtered; | |
} | |
}).filter("distFilter", function () { | |
return function (items, g, limitato) { | |
if (limitato) { | |
var maxRange = 4; | |
var filtered = []; | |
if (g) { | |
var type = g.layerType; | |
var layer = g.layer; | |
var lat = null; | |
var lng = null; | |
if (type == "marker") { | |
lat = layer.getLatLng().lat; | |
lng = layer.getLatLng().lng; | |
} else if (type == "polygon") { | |
lat = layer.getBounds().getCenter().lat; | |
lng = layer.getBounds().getCenter().lng; | |
} | |
var r = maxRange * 1000; | |
var center = L.latLng(lat, lng); | |
if (lat && lng) { | |
for (var i = 0; i < items.length; i++) { | |
var item = items[i]; | |
if (item.hasOwnProperty("lat") && item.hasOwnProperty("lon") && center.distanceTo(L.latLng(item.lat, item.lon)) < r) { | |
filtered.push(item); | |
}; | |
} | |
} | |
} | |
return filtered; | |
} else { | |
return items; | |
} | |
} | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<ion-view> | |
<ion-content has-header="true"> | |
<ion-toggle ng-model="limitato" ng-checked="limitato"> | |
Limita ad un raggio di 4 km | |
</ion-toggle> | |
<ion-item class="item-checkbox misure" style="border-style:none;text-align:center" ng-repeat="item in filteredItems = (items | propertyFilter:filterValue | distFilter:geom:limitato)"> | |
<label class="checkbox"> | |
<input type="checkbox" ng-model="item.checked"> | |
</label> | |
property: {{item.property}} | |
</ion-item> | |
<div ng-hide="filteredItems.length">Nessuna valore nelle vicinanze | |
<br> | |
</div> | |
</ion-content> | |
</ion-view> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment