2.7. Setup map. Events

Theory

Every time something happens in NgwMap, e.g. user clicks or map zoom changes, the corresponding object sends an event which you can subscribe to with a function. It allows to react to user interaction.

Subscribe to all events via a special property:

ngwMap.emitter.on("moveend", onMapEvent);

Each object has its own set of events — see documentation for details.

There are several ways to subscribe to layer events:

global:

ngwMap.emitter.on("layer:toggle", (ev) => {
  if (ev.id === id) {
    console.log("layer:toggle", ev);
  }
});

or separately for each layer:

ngwMap.emitter.on("layer-" + id + ":toggle", (ev) => {
  console.log("layer-" + id + ":toggle", ev);
});

More examples

• events

Practice

• subscribe to different events using the on and once methods;
• learn to unsubscribe from events with off (this is very important).

To run this example, you need to execute these commands in the terminal:

npm i
npm start

Open http://localhost:8080.

LAUNCH in the codesandbox.io.

BACK TO CONTENT