I know that geojson has attribute filter, so my question is how should it be done ? I assume there is no way to do simple geojson | filter:search, so it should be done on the side of angular?
I found good solution but it works only with mapbox, it is possible to do something like below with leaflet-angular-directive?
<mapbox map-id="examples.map-i86l3621" lat="11.403569" lng="8.329453" zoom="3"> <div ng-repeat="hf in hf_directory |filter:search"> <marker lat="{{hf.geometry.coordinates[1]}}" lng="{{hf.geometry. coordinates[0]}}" color="#39cccc"> </marker> </div> </mapbox>
I use simple filtering
<input ng-model="search.properties.Primary_Name" placeholder="Primary Name" >
<tr ng-repeat="hf in hf_directory| filter:search">
My Template:
<leaflet id="map" center="center" defaults="defaults" geojson="geojson"> </leaflet>
I use leaflet-angular-directive and it looks like this:
var AppMapDirectory = angular.module('DirectoryAppMap', ['ngResource', 'leaflet-directive']); AppMapDirectory.factory(" Directory", function($resource) { return $resource("json/result.json", {}, { get: { method: "GET", cache: true } });}); AppMapDirectory.controller(" DirectoryMapList", ["$scope", "Directory", "$filter", function($scope, Directory, $filter) { Directory.get(function(data) { $scope.hf_directory = data.features; function onEachFeature(feature, layer) { layer.bindPopup("<b>Name:</b> " + feature.properties.Name + "<br><b>Category:" + feature.properties.Category + "<br>Primary Name:" + feature.properties.Primary_ Name + ""); } angular.extend($scope, { geojson: { onEachFeature: onEachFeature, data: $scope.hf_directory } }); }); angular.extend($scope, { defaults: { tileLayer: "https://dnv9my2eseobd. cloudfront.net/v3/foursquare. map-ikj05elx/{z}/{x}/{y}.png", maxZoom: 14, minZoom: 1 }, center: { lat: 8.1238, lng: 11.8777, zoom: 2 } });
Actually i wrote simple filter function for geojson, but maybe somebody could show me direction how to make that this function will work together with input ng-model search?
The way as i did it is not dynamic
function filter(feature) { return feature.properties.PrimaryName == "somename"; } angular.extend($scope, { geojson: { onEachFeature: onEachFeature, data: $scope.hf_directory, filter:filter } });
