topodrop-react v1.0.2
topodrop-react
This component is meant to be used with maps that were created at https://topodrop.com
topodrop-react allows you easily render maps in your application by including the
topodrop component and simply passing in an id
and apiKey
. The id
corresponds with
the id that is located in your map url ie: https://topodrop.com/edit/yDHyQyG9Wr66aBXXD
Demo & Examples
Live demo: azamatsmith.github.io/topodrop-react
To build the examples locally, run:
npm install
npm start
Then open localhost:8000
in a browser.
Installation
The easiest way to use topodrop-react is to install it from NPM and include it in your own React build process (using Browserify, Webpack, etc).
You can also use the standalone build by including dist/topodrop-react.js
in your page. If you use this, make sure you have already included React, and it is available as a global variable.
npm install topodrop-react --save
Usage
Using topodrop-react is as simple as importing
import TopoDrop from 'topodrop-react'
<TopoDrop
id="YOURIDHERE"
apiKey="GOOGLEMAPSAPIKEY"
/>
Development (src
, lib
and the build process)
NOTE: The source code for the component is in src
. A transpiled CommonJS version (generated with Babel) is available in lib
for use with node.js, browserify and webpack. A UMD bundle is also built to dist
, which can be included without the need for any build system.
To build, watch and serve the examples (which will also watch the component source), run npm start
. If you just want to watch changes to src
and rebuild lib
, run npm run watch
(this is useful if you are working with npm link
).
License
Copyright (c) 2016 Matt Smith.