Skip to content

tcallsen/react-func-openlayers

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Using OpenLayers 8 with React Functional Components and Hooks

Here is a sample application that demonstrates how to integrate OpenLayers with React Functional Components including:

  • creating a wrapper component (MapWrapper.js)
  • using hooks to initialize the map and add features from props
  • get/set component state from within an OpenLayers event handler using refs
  • Fetch and parse GeoJSON features from a mock API (done inside App.js)

An example application featuring OpenLayers and React Functional Components

Install

Install the dependencies with the following command:

npm install

Launch with Development Server

To run a development build and launch the development server, execute:

npm start

Once completed, the app should be avialable from http://localhost:3000/

Development Environment

This application was developed using create-react-app, with Node version v18.18.2

Supplemental Blog Post

Here is a blog post I created that explains the integration in further detail: https://taylor.callsen.me/using-openlayers-with-react-functional-components/

About

A sample application that demonstrates how to integrate OpenLayers with React Functional Components.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published