Open Community Map is a platform intended to gather various local community and location-based services on one map.
It can be used from:
- https://communitymap.online
- Partner 3rd party website with the map embedded with
<iframe>
- Self-hosted solution
More details about project ideas and structure can be found in the Wiki
Feel free to join our Slack space and ask questions or share your ideas with us!
It's possible to embed the map into 3rd party site. You need to use the appId we'll provide you.
https://communitymap.online/embed/?appId=<your-app-id>
Example:
<iframe
src="https://communitymap.online/embed?appId=Test42"
allow="geolocation"
style="border-width: 0;"
width="100%"
height="850"
></iframe>
Currently you can filter to show only your objects on the map using optional filterOrigin query parameter. If it's missing, all types of objects are shown.
Optional centerLat and centerLng parameters define the default coordinates to the map.
Optional canAdd allows to hide UI elements for adding objects from this view. If you need to add them your own way, hide them and use the API.
<iframe
src="https://communitymap.online/embed?appId=Test42&filterOrigin=Test42¢erLat=43.123¢erLng=24.122&canAdd=false"
allow="geolocation"
style="border-width: 0;"
width="100%"
height="850"
></iframe>
Check out the API documentation
Fork the project and then clone your fork. Read more about Fork & PR strategy
git clone git@github.com:<YOUR_GITHUB_USER>/communitymap-ui.git
cd community-map/
yarn install
Now you can run the web app:
yarn start
It runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
You will use pre-configured Community Map Dev firebase project.
Read also about the DB structure
The maps with show 'For development purposes only' watermark all over the map.
To fix that create .env file and fill in your Google Maps Key.
For self-hosted installation you need to configure different Firebase project.
cp .env.sample .env
Init firebase and choose your firebase project
firebase init
Copy web app firebase config from Firebase Project Settings -> General -> Your Apps -> Web apps -> (*) Config and store it in src/firebaseConfig.ts like this:
export const firebaseConfig = {
...
}
This project was bootstrapped with Create React App.