How to use the react-map-gl.TRANSITION_EVENTS.UPDATE function in react-map-gl

To help you get started, we’ve selected a few react-map-gl examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github resource-watch / resource-watch / components / map / component.js View on Github external
height: this.mapContainer.current.offsetHeight,
      ...currentViewport
    };

    const { longitude, latitude, zoom } = new WebMercatorViewport(viewport).fitBounds(
      [[bbox[0], bbox[1]], [bbox[2], bbox[3]]],
      options
    );

    const newViewport = {
      ...currentViewport,
      longitude,
      latitude,
      zoom,
      ...fitBoundsOptions,
      transitionInterruption: TRANSITION_EVENTS.UPDATE
    };

    this.setState({
      flying: true,
      viewport: newViewport
    });
    onViewportChange(newViewport);

    setTimeout(() => {
      this.setState({ flying: false });
    }, 1500);
  };
github Vizzuality / gfw / app / javascript / components / map-geostore / component.jsx View on Github external
};

    const { longitude, latitude, zoom } = new WebMercatorViewport(v).fitBounds(
      [[bbox[0], bbox[1]], [bbox[2], bbox[3]]],
      { padding: this.props.padding }
    );

    if (this.mounted) {
      this.setState({
        viewport: {
          ...this.state.viewport,
          longitude,
          latitude,
          zoom,
          transitionDuration: 0,
          transitionInterruption: TRANSITION_EVENTS.UPDATE
        }
      });
    }
  };