bb-routemap v0.0.5

RouteMap

Renders a map of a route described by a geoJson object. Alternatively only a marker with the start location of the route is rendered in the map if the geoJson object is not provided.

Google Maps API

This component will not load Google Maps API for you, I decided to implement the component this way because in my previous experience with Google Maps and React, the API was normally loaded by a higher order component.

You can find an example on how to load the API in the App.js file in the repository.

Usage

import geoJsonExample from './pathExample';

<RouteMap
  start={{lat: 51.509865, lng: -0.118092}}
  finish={{lng: 0.522699, lat: 51.270363}}
  mapTypeId='roadmap'
  zoom={8}
  geoJson={geoJsonExample}
  showStartFinishMarkers={true}
/>

Parameters

• start : Location where the marker for the start of the route will be rendered
• finish : Location where the marker for where the route finishes will be rendered
• mapTypeId : As in the Google Maps API
• zoom : As in the Google Maps API
• showStartFinishMarkers : If true start and finish markers are rendered, default is false
• geoJson: GeoJson object
• style : CSS style applied to the div that wraps the map
• routeFeatureStyle : Google Maps API feature style applied to the route path.

Dev setup

Create the .env file in the root directory, defining the variables listed in .env.default.

Todo

Testing setup is ready, but now need to implement the tests listed in the spec file

Known issues

Installing the dependencies for linting might fail depending on the way eslint has been installed on your machine. Following the command that is described in 'eslint-config-airbnb' does the trick: https://www.npmjs.com/package/eslint-config-airbnb