react-openlayers - OpenLayer React Components

  •        150

Allen Kim is the creator of ngmap and ng2-map. If you like this, you may also like geo-coder.


@types/googlemaps : ^3.26.4
cross-env : ^4.0.0
google-maps : ^3.2.1
ol-mapbox-style : ^2.1.1
qwest : ^4.4.5
react-async-loader : ^0.1.2
react-async-script-loader : ^0.2.2



Related Projects

react-map-gl - React friendly API wrapper around MapboxGL JS

  •    Javascript

In addition to exposing MapboxGL functionality to React apps, react-map-gl also integrates seamlessly with - react-map-gl is extensively tested with browserify and works without configuration.

angular-openlayers-directive - AngularJS directive to embed an interact with maps managed by the OpenLayers library

  •    Javascript

Work in progress.AngularJS directive for the OpenLayers (version 3) Javascript Library. This software allows you to embed maps managed by openlayers on your AnguarJS or OpenLayers project. It's a good starting point to learn the Openlayers API too.

sidebar-v2 - A responsive sidebar with tabs for Leaflet, OpenLayers, Google Maps, ...

  •    CSS

A responsive sidebar for mapping libraries like Leaflet or OpenLayers. It is more or less a successor of the leaflet-sidebar plugin, thus the v2 suffix.

OpenLayers Map Portlet

  •    Javascript

OpenLayers Map portlet adds a new portlet to Zenoss Dashboard, similar to Google Maps portlet.

react-codemirror2 - Codemirror integrated components for React

  •    TypeScript

react-codemirror2 ships with the notion of an uncontrolled and controlled component. UnControlled consists of a simple wrapper largely powered by the inner workings of codemirror itself, while Controlled will demand state management from the user, preventing codemirror changes unless properly handled via value. The latter will offer more control and likely be more appropriate with redux heavy apps. Since codemirror ships mostly unconfigured, the user is left with the responsibility for requiring any additional resources should they be necessary. This is often the case when specifying certain language modes and themes. How to import/require these assets will vary according to the specifics of your development environment. Below is a sample to include the assets necessary to specify a mode of xml (HTML) and a material theme.

react-firebase-hooks - React Hooks for Firebase.

  •    TypeScript

A set of reusable React Hooks for Firebase. Official support for Hooks was added to React Native in v0.59.0. React Firebase Hooks works with both the Firebase JS SDK and React Native Firebase, although some of the Flow and Typescript typings may be incorrect - we are investigating ways to improve this for React Native Firebase users.

react-mapbox-gl - A React binding of mapbox-gl-js

  •    TypeScript

If those properties changed at the mapbox-gl-js level and you don't update the value kept in your state, it will be unsynced with the current viewport. At some point you might want to update the viewport value (zoom, pitch or bearing) with the ones in your state but using value equality is not enough. Taking zoom as example, you will still have the unsynced zoom value therefore we can't tell if you want to update the prop or not. In order to explicitly update the current viewport values you can instead break the references of those props and reliably update the current viewport with the one you have in your state to be synced again. Please try to reproduce your problem with the boilerplate before posting an issue.

react-native-template-typescript - 👾 Clean and minimalist React Native template for a quick start with TypeScript

  •    Objective-C

Clean and minimalist React Native template for a quick start with TypeScript. You may need to remove the globally installed react-native-cli (npm uninstall -g react-native-cli), for the above command to work. The global react-native-cli is deprecated, and no longer supported.

react-redux-typescript-guide - The complete guide to static typing in "React & Redux" apps using TypeScript

  •    TypeScript

You should check out Playground Project located in the /playground folder. It is a source of all the code examples found in the guide. They are all tested with the most recent version of TypeScript and 3rd party type definitions (like @types/react or @types/react-redux) to ensure the examples are up-to-date and not broken with updated definitions. Playground was created in such a way that you can simply clone the repository locally and immediately play around on your own. It will help you to learn all the examples from this guide in a real project environment without the need to create some complicated environment setup by yourself.

react-typescript-cheatsheet - a cheatsheet for react users using typescript with react for the first (or nth!) time


jpavon offers an alternative react-scripts-ts with Webpack 4 and better linting. In particular, make sure that you have @types/react and @types/react-dom installed. Read more about the DefinitelyTyped project if you are unfamiliar. There are also many React + Typescript boilerplates, please see our Resources list below.

react-native-baidu-map - Baidu Map SDK modules and view for React Native(Android & IOS), support react native 0

  •    Objective-C

Baidu Map SDK modules and view for React Native(Android & IOS), support react native 0.40+. 百度地图相关模块和视图,支持react native 0.40+。

reactql - Universal React+GraphQL starter kit: React 16, Apollo 2, Webpack 4, Styled Components 4, React Router 4, PostCSS, SSR

  •    TypeScript

Universal front-end React + GraphQL starter kit, written in Typescript. Hot code reloading. Make a change anywhere in your code base (outside of the Webpack config), and changes will be pushed down the browser automatically - without page reloads. This happens for React, Styled Components, SASS - pretty much anything.


  •    Java

IMPORTANT: gt;gt;gt; THIS PROJECT HAS MOVED lt;lt;lt; This project has moved to Bitbucket. Downloads of older versions have been removed as these version are no longer supported. If you want to use gwt-openlayers, you can find the latest version at: or search for quot;gwt-openlayersquot; on:

react-bluekit - Automatically generating a component library from your React components (ES5, ES6, Typescript)

  •    Javascript

BlueKit automatically generates a library from your React components with editable props and live preview. Point BlueKit to folders with your React components and it will generate a library for you. You'll be able to browse through the components, tweak their props, and see the changes live. Furthermore, any changes that you make to your components' code will be reflected in the library.

fetch-suspense - A React hook compatible with React 16.6's Suspense component.

  •    TypeScript

useFetch is a React hook that supports the React 16.6 Suspense component implementation. The design decisions and development process for this package are outlined in the Medium article React Suspense with the Fetch API.

use-react-router - React Hook for pub-sub behavior using React Router.

  •    TypeScript

useReactRouter() returns an object that contains the history, location, and match properties that would be passed as props by the HOC. A tutorial covering the design and development of this package can be found on Medium: How to Convert withRouter to a React Hook.

typed-react - A binding layer between React and TypeScript

  •    TypeScript

In this case we export the Props and the Factory but we could make the props and state inline interfaces and just export the factory function. TypedReact supports using existing React Mixins as well as defining new mixins with idiomatic TypeScript. The example is based on You need to use createMixin on your own mixins and should export that from your mixin modules.

react-docgen-typescript - A simple parser for react properties defined in typescript instead of propTypes

  •    TypeScript

A simple parser for React properties defined in TypeScript instead of propTypes. It can be used with React Styleguidist.

reaviz - 📊 Data visualization library for React based on D3

  •    TypeScript

REAVIZ is a modular chart component library that leverages React natively for rendering the components while using D3js under the hood for calculations. The library provides an easy way to get started creating charts without sacrificing customization ability.