Bugfix and add example with the polyline

Author: lepirlouit

dist/components/Polyline.js

@@ -157,19 +157,19 @@
         var _props = this.props,
             map = _props.map,
             google = _props.google,
-            paths = _props.paths,
+            path = _props.path,
             strokeColor = _props.strokeColor,
             strokeOpacity = _props.strokeOpacity,
             strokeWeight = _props.strokeWeight,
-            props = _objectWithoutProperties(_props, ['map', 'google', 'paths', 'strokeColor', 'strokeOpacity', 'strokeWeight']);
+            props = _objectWithoutProperties(_props, ['map', 'google', 'path', 'strokeColor', 'strokeOpacity', 'strokeWeight']);
 
         if (!google) {
           return null;
         }
 
         var params = _extends({
           map: map,
-          paths: paths,
+          path: path,
           strokeColor: strokeColor,
           strokeOpacity: strokeOpacity,
           strokeWeight: strokeWeight
@@ -211,7 +211,7 @@
   }(_react2.default.Component);
 
   Polyline.propTypes = {
-    paths: _propTypes2.default.array,
+    path: _propTypes2.default.array,
     strokeColor: _propTypes2.default.string,
     strokeOpacity: _propTypes2.default.number,
     strokeWeight: _propTypes2.default.number

examples/components/withPolylines.js

@@ -0,0 +1,36 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+
+import Map, {GoogleApiWrapper} from '../../src/index'
+import Polyline from '../../src/components/Polyline'
+
+const WithPolylines = React.createClass({
+  render: function() {
+    if (!this.props.loaded) {
+      return <div>Loading...</div>
+    }
+
+    const polyline = [
+      { lat: 37.789411, lng: -122.422116 },
+      { lat: 37.785757, lng: -122.421333 },
+      { lat: 37.789352, lng: -122.415346 }
+    ]
+
+    return (
+      <Map google={this.props.google}
+          style={{width: '100%', height: '100%', position: 'relative'}}
+          className={'map'}
+          zoom={14}>
+          <Polyline
+            path={polyline}
+            strokeColor="#0000FF"
+            strokeOpacity={0.8}
+            strokeWeight={2}
+            fillColor="#0000FF"
+            fillOpacity={0.35} />
+      </Map>
+    )
+  }
+});
+
+export default WithPolylines

examples/index.js

@@ -34,6 +34,10 @@ const routeMap = {
   'polygons': {
     name: 'Polygon',
     component: require('./components/withPolygons').default
+  },
+  'polyline': {
+    name: 'Polyline',
+    component: require('./components/withPolylines').default
   }
 }
 

src/components/Polyline.js

@@ -42,7 +42,7 @@ export class Polyline extends React.Component {
     const {
       map,
       google,
-      paths,
+      path,
       strokeColor,
       strokeOpacity,
       strokeWeight,
@@ -55,7 +55,7 @@ export class Polyline extends React.Component {
 
     const params = {
       map,
-      paths,
+      path,
       strokeColor,
       strokeOpacity,
       strokeWeight,
@@ -90,7 +90,7 @@ export class Polyline extends React.Component {
 }
 
 Polyline.propTypes = {
-  paths: PropTypes.array,
+  path: PropTypes.array,
   strokeColor: PropTypes.string,
   strokeOpacity: PropTypes.number,
   strokeWeight: PropTypes.number