React GIS App build using Leaflet
Explore the docs »

View Demo · Report Bug · Request Feature

This project enhancing ReactJS GIS implementation using Leaflet. This project has a tool for visualizing and analyzing spatial data. It uses GeoJSON files as input and allows users to view and manipulate the data in various ways.

This projects is built with

• Leaflet for mapping and visualization
• React is a JavaScript library for building user interfaces
• Vite a javascript build tool
• GeoJSON is a format for encoding a variety of geographic data structures.

This is an example of how you may give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.

To run the application, after you install Node.js you also need yarn installed on your system. This project is also using vite as a build tool that aims to provide a faster develpoment experience. Once you have those dependencies installed, you can install the application by running the following command in the root directory of the project:

$ cd your-project
$ yarn
$ yarn dev

To use the application, you will need to have a GeoJSON file that you want to visualize. Once you have the file, you can start the application by running the following command:

$ yarn dev

This will start the application and open a web browser window with the application interface. From there, you can use the various controls to view and manipulate the data in the GeoJSON file.

See the open issues for a list of proposed features (and known issues).

Geospatial data taken from this GeoJSON file. At this phase I just converted to JavaScript object variable to make it simple to use, and for the next phase it will be .json file.

Note: Geospatial data refers to data that is associated with a specific location on the earth's surface. This can include data about geographical features, such as rivers, mountains, and roads, as well as data about human-made structures, such as buildings, bridges, and pipelines.

• Show map Marker from the Geospatial Data above
• Custom marker
• Filter radius based on Marker (City)
• Custom circle radius (add tooltip for more information)
• Geo filter, filter by continents
• Analyse geospatial data () (Under development)
• etc...

Arista - @Arista_Indra - arista.indrajay@gmail.com

Project Link: React GIS

This application is licensed under the MIT License. See the LICENSE file for more details.

• React
• Leaflet
• GeoJSON
• Vite
• GitHub Emoji Cheat Sheet
• Img Shields
• Choose an Open Source License
• GitHub Pages