Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/appbaseio/reactivemaps
A data aware UI components library for building realtime maps
https://github.com/appbaseio/reactivemaps
data-components javascript maps react realtime ui ui-components web-ui
Last synced: about 14 hours ago
JSON representation
A data aware UI components library for building realtime maps
- Host: GitHub
- URL: https://github.com/appbaseio/reactivemaps
- Owner: appbaseio
- Created: 2016-06-18T11:20:35.000Z (over 8 years ago)
- Default Branch: website
- Last Pushed: 2023-01-25T07:18:02.000Z (almost 2 years ago)
- Last Synced: 2024-08-03T20:14:22.340Z (3 months ago)
- Topics: data-components, javascript, maps, react, realtime, ui, ui-components, web-ui
- Language: JavaScript
- Homepage: https://opensource.appbase.io/reactivemaps
- Size: 60.2 MB
- Stars: 939
- Watchers: 25
- Forks: 44
- Open Issues: 36
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Reactivemaps
UI components for building data-driven Map UIs with Elasticsearch, OpenSearch and MongoDB Atlas Search. Website 🌐
[](https://badge.fury.io/js/%40appbaseio%2Freactivemaps)
[](https://github.com/appbaseio/mirage/blob/dev/LICENSE.md)
[](https://gitter.im/appbaseio/reactivesearch)
[](https://www.npmjs.com/package/@appbaseio/reactivemaps)
[](https://github.com/appbaseio/reactivesearch/blob/dev/.github/CONTRIBUTING.md)
Elasticsearch UI components for building data-driven Map UIs.
[Get our designer templates for sketch](https://opensource.appbase.io/reactivemaps/resources/ReactiveMaps_Playground.sketch).
## Installation
ReactiveMaps is a complimentary library to ReactiveSearch. Map components require ReactiveSearch architecture and its root component to begin with. If you wish to build anything on reactivemaps, you’ll need to install reactivesearch along with it.
```
yarn add @appbaseio/reactivemaps @appbaseio/reactivesearch
```
## Introduction
Reactivemaps allow you to connect your google-map component with your Elasticsearch cluster and also enables it to talk to other **reactive** components. Not just that, it enhances the development experience by efficiently integrating the streaming enhancements on the map component allowing you to build realtime apps with maps seamlessly.
Reactivemap efficiently evaluates the map centers dynamically as the map updates and it also allows you to search on the map as it is moved. All and all, Reactivemap offers a rich bundled experience of realtime maps with a simple-to-use API.
## Concepts
**1. Map component**
ReactiveMaps provides map UI components. There are two flavors of Map components: [ReactiveOpenStreetMap](https://docs.appbase.io/docs/reactivesearch/v3/map/reactiveopenstreetmap/) and [ReactiveGoogleMap](https://docs.appbase.io/docs/reactivesearch/v3/map/reactivegooglemap/)
**2. Complimentary sensor components**
Besides the sensor components from reactivesearch, reactivemap is compatible with two other pre-defined sensor components - GeoDistanceSlider and GeoDistanceDropdown. You can read more about them in the [docs](https://docs.appbase.io/docs/reactivesearch/v3/map/geodistanceslider/)
## Live Demos
A set of live demos inspired by real world apps, built with Reactivemaps.
* [Airbeds](https://opensource.appbase.io/reactivesearch/demos/airbeds/) - An airbnb-like booking search experience.
* [Datalayers](https://opensource.appbase.io/reactivesearch/demos/datalayer/) - Demo combining the dark forces of datalayer and Reactivemaps.
* [Meetup Blast](https://opensource.appbase.io/reactivesearch/demos/meetup/) - A kickass meetup inspired search app built with Reactivemaps.
* [Board the bus](https://opensource.appbase.io/reactivesearch/demos/transport/) - Catch realtime bus transportation demo in action with Reactivemaps.
## Documentation
The official docs for the library are at [docs.appbase.io/docs/reactivesearch/v3/overview/quickstart/](https://docs.appbase.io/docs/reactivesearch/v3/overview/quickstart/).
## Related tooling and projects
* [**ReactiveSearch**](https://opensource.appbase.io/reactivesearch/) Everything you need to know about reactivesearch.
* [**appbase-js**](https://github.com/appbaseio/appbase-js) While building search UIs is dandy with Reactive Search, you might also need to add some input forms. **appbase-js** comes in handy there.
* [**dejavu**](https://github.com/appbaseio/dejavu) allows viewing raw data within an appbase.io (or Elasticsearch) app. **Soon to be released feature:** An ability to import custom data from CSV and JSON files, along with a guided walkthrough on applying data mappings.
