npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@appbaseio/reactivemaps

v4.0.0

Published

React Components for building map UIs

Downloads

1,017

Readme

npm version Gitter npm PRs Welcome

Elasticsearch UI components for building data-driven Map UIs.

Get our designer templates for 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

ReactiveMap creates a data-driven map UI component. It is the key component for build map based experiences. - ReactiveMap

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

Live Demos

A set of live demos inspired by real world apps, built with Reactivemaps.

  • Airbeds - An airbnb-like booking search experience.
  • Datalayers - Demo combining the dark forces of datalayer and Reactivemaps.
  • Meetup Blast - A kickass meetup inspired search app built with Reactivemaps.

Documentation

The official docs for the library are at https://opensource.appbase.io/reactive-manual.

Related tooling and projects

  • ReactiveSearch Everything you need to know about reactivesearch.

  • 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 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.

  • mirage ReactiveSearch components can be extended using custom Elasticsearch queries. For those new to Elasticsearch, Mirage provides an intuitive GUI for composing queries.