Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

angular-ymaps

Package Overview
Dependencies
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

angular-ymaps

[Angular JS]: http://angularjs.org [ymaps.GeoObject]: https://tech.yandex.ru/maps/doc/jsapi/2.0/ref/reference/GeoObject-docpage/ [ymaps.Clusterer]: https://tech.yandex.ru/maps/doc/jsapi/2.0/ref/reference/Clusterer-docpage/

  • 0.1.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Maintainers
1
Created
Source

Angular-ymaps Build Status

Yandex Maps API as an Angular JS direcitive.

Это модуль для Angular JS, предназначенный для простого подключения и работы с Яндекс-картами. С его помощью можно вставлять Яндекс карту на страницу через html-тег, так же просто как img или button

###Документация и пример использования

###Подключение

  • Скачать библиотеку или ее упакованную версию
  • Подключить скрипт на страницу <script src="angular-ymaps.js"></script>
  • Добавить модуль ymaps в зависимости своего angular-приложения angular.module('MyApp', ['ymaps'])
  • Теперь можно использовать в HTML новые теги
    • <yandex-map> - Яндекс-карта
    • <ymap-marker> - маркер на карте, вставляется только внутрь тега <yandex-map>
Bower

Можно установить библиотеку из bower:

bower install angular-ymaps --save

API

####Тег yandex-map:

<yandex-map center="map.center" zoom="map.zoom"></yandex-map>

Добавляет Яндекс-карту на страницу. Размеры карты определяются размерами элемента, их можно задать в css. При создании нужно указать два обязательных атрибута:

  • center(Array) - массив из двух чисел, широта и долгота центра карты
  • zoom(Number) - число, от 0 до 23, масштаб карты. Во избежание ошибок нужно задавать разрешенный масштаб для указанной области

####Тег ymap-marker:

Может использоваться только внутри тега карты, добавляет на нее точку. Имеются следующие атрибуты

  • coordinates(Array) - массив из двух чисел, широта и долгота маркера на карте (обязательный)
  • index(String) - текст, который пишется на маркере
  • properties(Object) - свойства метки, передаются в ymaps.GeoObject. Здесь может быть текст балуна, который открывается при нажатии на метку, или всплывающей при наведении подсказки. Подробнее - в документации Яндекс, описание параметра properties.

####Глобальные настройки

Можно управлять видом и функциоальностью карты через свойства, вынесенные в константу ymapsConfig:

  • apiUrl (String) - ссылка для загрузки API карт. Может переопределяться для загрузки другой версии. По умолчанию загружается 2.1-stable
  • mapBehaviors (Array) - возможные поведения карты, массив ключей, которые принимает ymaps.map.behavior.Manager. Стандартное значение: ['default']
  • mapControls (Array) - возможные элементы управления карты, массив ключей, которые принимает ymaps.map.control.Manager. Стандартное значение: ['default']
  • markerOptions (Object) - опции, передаваемые ymaps.GeoObject, то есть настройки внешнего вида и поведения маркеров на карте. Стандартное значение: {preset: 'islands#darkgreenIcon'}
  • clusterize (Boolean) – объединять ли маркеры в кластеры. По умолчанию false
  • clusterOptions (Object) - опции кластера ymaps.Clusterer, применяются если включена кластеризация. Стандартное значение: {preset: 'islands#darkGreenClusterIcons'}
  • fitMarkers (Boolean) - автоматически подстраивать видимую область и масштаб карты, чтобы было видно все точки на карте. Стандартное значение: true
  • fitMarkersZoomMargin (Boolean) – отступ от границ карты при подстраивании масштаба под маркеры. Стандартное значение: 40 (px)

FAQs

Package last updated on 03 Nov 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc