Update center now works

fix #2

Author: iamdanfox

demo/singleMapRefreshable.html

@@ -28,6 +28,7 @@
   RefreshMap = React.createClass({
     getInitialState: function(){
       return {
+        center:   {latitude:60.1876172,longitude:24.815366},
         points: [ {latitude:60.1876172,longitude:24.815366}  ]
       }
     },
@@ -39,10 +40,15 @@
       ]
       this.setState({points:randomPoints})
     },
+    randomizeCenter: function(){
+      newCenter = {latitude:60.1876172+2*Math.random()-1,longitude:24.815366+2*Math.random()-1}
+      this.setState({center:newCenter})
+    },
     render: function(){
       return (
       <div>
-        <Map latitude={60.170833} longitude={24.9375} zoom={6} width='100%' height={250} points={this.state.points} />
+        <Map latitude={this.state.center.latitude} longitude={this.state.center.longitude} zoom={6} width='100%' height={250} points={this.state.points} />
+        <button onClick={this.randomizeCenter}>Randomize Center</button>
         <button onClick={this.randomize}>Randomize Points</button>
       </div>
       )

src/map.js

@@ -64,6 +64,11 @@ var Map = React.createClass({
     this.setState( { markers : markers });
   },
 
+  updateCenter: function(newLat, newLon){
+    var newCenter = new google.maps.LatLng(newLat, newLon)
+    this.state.map.setCenter(newCenter)
+  },
+
   render : function() {
 
     var style = {
@@ -102,6 +107,8 @@ var Map = React.createClass({
   // update markers if needed
   componentWillReceiveProps : function(props) {
     if( props.points ) this.updateMarkers(props.points);
+
+    if( props.latitude || props.longitude) this.updateCenter(props.latitude, props.longitude)
   }
 
 });