angular8-yandex-maps

Angular8-yandex-maps

Angular-Yandex-Maps is an Angular library for simplifying work with the Yandex.Maps API. Supports Angular 6+.

The library implements the main components: map, panorama, placemark, geoobject, multiroute and controls. It also returns ymaps instance so you can use full API. For a more detailed description of inputs, outputs etc. check API Yandex.Maps documentation.

Leave suggestions, problems, errors, difficulties in GitHub Issues. Thanks for using the library!

Documentation

Documentation

Examples

Examples

Installation

npm install angular8-yandex-maps

Usage

app.module.ts

Default map config options

import { AngularYandexMapsModule } from 'angular8-yandex-maps';

@NgModule({
  imports: [AngularYandexMapsModule]
})
export class AppModule { }

Own map config options

import { AngularYandexMapsModule, IConfig } from 'angular8-yandex-maps';

const mapConfig: IConfig = {
  apikey: 'API_KEY',
  lang: 'en_US',
};

@NgModule({
  imports: [AngularYandexMapsModule.forRoot(mapConfig)]
})
export class AppModule { }

Injection token

import { AngularYandexMapsModule, YA_MAP_CONFIG } from 'angular8-yandex-maps';

@NgModule({
  imports: [AngularYandexMapsModule],
  providers: [{
    provide: YA_MAP_CONFIG,
    useValue: {
      apikey: 'API_KEY',
      lang: 'en_US',
    }
  }],
})
export class AppModule { }

component.html

<div class="container">
  <angular-yandex-map [center]="[55.751952, 37.600739]" [zoom]="12">
    <angular-yandex-placemark [geometry]="[55.751952, 37.600739]"></angular-yandex-placemark>
  </angular-yandex-map>
</div>

component.css

.container {
  width: 1000px;
  height: 500px;
}

Changelog

CHANGELOG

License

MIT