HTML:
<ya-map ya-zoom="11" ya-center="{{ center }}" ya-before-init="beforeInit()" ya-after-init="afterInit($target)" ya-event-click="mapClick($event)"> <ya-collection ya-options="{preset: 'twirl#metroMoscowIcon'}"> <ya-geo-object ng-repeat="m in metros" ya-source="m"></ya-geo-object> </ya-collection> <ya-collection ya-options="{preset:'twirl#redStretchyIcon',balloonMaxWidth:250}"> <ya-geo-object ng-repeat="o in geoObjects" ya-source="o"></ya-geo-object> </ya-collection> </ya-map>
javascript:
$scope.beforeInit = function(){ ymaps.geocode('Нижний Новгород', { results: 1 }).then(function (res) { // Выбираем первый результат геокодирования. var firstGeoObject = res.geoObjects.get(0); // Задаем центр карты. $scope.$apply(function(){ $scope.center = firstGeoObject.geometry.getCoordinates(); }); }, function (err) { // Если геокодирование не удалось, сообщаем об ошибке. alert(err.message); }); }; var loadMetro = function(){ if(!$scope.center || !$scope.map){ return; } // Поиск станций метро. // Делаем запрос на обратное геокодирование. ymaps.geocode($scope.center, { // Ищем только станции метро. kind: 'metro', // Ищем в пределах области видимости карты. boundedBy: $scope.map.getBounds(), // Запрашиваем не более 20 результатов. results: 20 }).then(function (res) { var geos = []; res.geoObjects.each(function(obj){ //console.log(obj); geos.push({ geometry:{ type:'Point', coordinates:obj.geometry.getCoordinates() } }); }); $scope.$apply(function(){ $scope.metros = geos; }); }); }; $scope.$watch('center',loadMetro); $scope.$watch('map', loadMetro); $scope.afterInit = function(map){ $scope.map = map; }; $scope.geoObjects = []; $scope.mapClick=function(e){ var coords = e.get('coordPosition'); // Отправим запрос на геокодирование. ymaps.geocode(coords).then(function (res) { var names = []; // Переберём все найденные результаты и // запишем имена найденный объектов в массив names. res.geoObjects.each(function (obj) { names.push(obj.properties.get('name')); }); // Добавим на карту метку в точку, по координатам // которой запрашивали обратное геокодирование. var geoObj = { geometry:{ type:'Point', coordinates:coords }, properties:{ // В качестве контента иконки выведем // первый найденный объект. iconContent:names[0], // А в качестве контента балуна - подробности: // имена всех остальных найденных объектов. balloonContent:names.reverse().join(', ') } }; $scope.$apply(function(){ $scope.geoObjects.push(geoObj); }); }); };