React-map-gl: Handling Events in Custom MapController

Created on 4 Dec 2018  路  5Comments  路  Source: visgl/react-map-gl

I'm trying to work with the MapController component to construct a DrawControl as described in https://github.com/uber/react-map-gl/issues/450#issuecomment-378590697, but using the updated API in v4

My simple controller looks like this:

class DrawController extends MapController {
  constructor({ enabled }) {
    super();
    this.enabled = enabled;
    this.events = ['click'];
  }

  handleEvent = (event) => {
    if (this.enabled) {
      if (event.type === 'click') {
        console.log('Clicked');
      }
    }
    return super.handleEvent(event);
  }
}

HandleEvent is called but the final line returns an error when returning to the parent handleEvent function

Uncaught TypeError: Cannot read property 'call' of undefined
    at DrawController._this.handleEvent (DrawController.js:16)
    at EventRegistrar._emit (event-registrar.js:115)
    at EventRegistrar.handleEvent (event-registrar.js:87)
    at Manager.emit (hammer.js:2525)
    at TapRecognizer.emit (hammer.js:2130)
    at TapRecognizer.tryEmit (hammer.js:1572)
    at TapRecognizer.<anonymous> (hammer.js:2109)
    at boundFn (hammer.js:197)
bug

Most helpful comment

Fix is published in 4.0.5

All 5 comments

Can you make sure that MapController is imported directly from react-map-gl? https://uber.github.io/react-map-gl/#/Documentation/introduction/upgrade-guide

I am having the same problem.

Seems that having an arrow function inside of a parent class does not allow children to use super when implementing the parent arrow function as an arrow function. On the other hand, implementing the parent arrow function as a function results in the child function not being called at all.

I think handleEvent must be changed to a function.

@guisers I had tried implementing handleEvent in my controller as a function instead, in doing so it was never called

Yes, what I mean is that the parent class MapController in react-map-gl needs this change. There doesn't appear to be anything we can do 馃槵

Fix is published in 4.0.5

Was this page helpful?
0 / 5 - 0 ratings

Related issues

joseomar10 picture joseomar10  路  5Comments

SethHamilton picture SethHamilton  路  3Comments

huaying picture huaying  路  5Comments

AriLFrankel picture AriLFrankel  路  3Comments

sudoStatus200 picture sudoStatus200  路  5Comments