React Arcgis screenshot

React Arcgis

Author Avatar Theme by Esri
Updated: 7 Jul 2022
320 Stars

A few components to help you get started using the ArcGIS API for JavaScript and esri-loader with React

Overview

The react-arcgis library, although archived since July 2022, has served as a useful tool for developers seeking seamless integration of the ArcGIS API for JavaScript within their React applications. It provided several ready-to-use components such as <Map />, <Scene />, <WebMap />, and <WebScene />, which allowed users to work effectively with geographic data. While the library is no longer actively maintained, it paved the way for more modern approaches to incorporate GIS capabilities in React environments.

For developers who might be looking for alternatives, the modern landscape offers compelling options like @arcgis/core and esri-loader, which streamline the usage of the ArcGIS API within React applications efficiently. This shift encourages developers to adopt updated practices and utilize the latest tools suitable for building contemporary applications.

Features

  • Ready-to-Use Components: Includes essential components such as <Map /> and <Scene /> that facilitate quick integration of GIS functionalities.
  • Lazy Loading with esri-loader: Efficiently loads ArcGIS API modules only when needed, optimizing performance and reducing initial load times.
  • Customizable Properties: Easily modify styles and pass specific properties into components using viewProperties and mapProperties for tailored geographic displays.
  • Error Handling: Provides onLoad and onFail handlers to manage the loading state of maps and handle errors gracefully.
  • Support for Webmaps and Webscenes: Directly integrate webmaps and webscenes from ArcGIS Online for enhanced dynamic capabilities in applications.
  • Advanced Configuration Options: Customize the behavior of esri-loader to suit specific project requirements, promoting flexibility in API integration.
  • Browser Compatibility Support: Offers guidance on implementing polyfills for environments lacking native promise support, ensuring broader browser compatibility.