Angular Map - Handle the Related Events

The Map UI component fires the routeAdded and routeRemoved events when a marker is added or removed. To handle them, assign functions to the onRouteAdded and onRouteRemoved properties, respectively.

HTML
TypeScript
  • <dx-map
  • [center]="{ lat: 40.749825, lng: -73.987963 }"
  • [zoom]="10"
  • (onRouteAdded)="routeAdded($event)"
  • (onRouteRemoved)="routeRemoved($event)">
  • </dx-map>
  • import { DxMapModule } from "devextreme-angular";
  • // ...
  • export class AppComponent {
  • routeAdded (e) {
  • const addedRoute = e.options;
  • // The original route used by the current map provider
  • const originalRoute = e.originalRoute;
  • // Event handling commands go here
  • };
  • routeRemoved (e) {
  • const removedRoute = e.options;
  • // Event handling commands go here
  • }
  • }
  • @NgModule({
  • imports: [
  • // ...
  • DxMapModule
  • ],
  • // ...
  • })
See Also