A React Google Maps Component

example.js

var GmapComponent = require('./google-maps-component');

var component = GmapComponent({
	lat: -23.5348644, lng: -46.6718231
});

var node = document.getElementById('main');


React.renderComponent(component, node);      

google-maps-component.js

/*
 * A React Google Maps Component.
 * This is a Browserify Module.
 * http://twitter.com/flavioatas
 * 
 * "window.google.maps" must be loaded beforehand.
 */
var React = require('react');

module.exports = React.createClass({

  getDefaultProps: function() {
    return {
      tagName: 'div',
      className: 'map',
      zoom: 12
    }
  },

  render: function() {
    return React.DOM[this.props.tagName]({
      className: this.props.className
    });
  },

  componentDidMount: function() {
    var node = this.getDOMNode();
    var options = {
      center: this.getLatLng(),
      zoom: this.props.zoom
    };
    var map = new window.google.maps.Map(node, options);
    this.setState({map: map});
  },

  componentDidUpdate: function() {
    this.state.map.panTo(this.getLatLng());
  },

  getLatLng: function() {
    return new google.maps.LatLng(
      this.props.lat, 
      this.props.lng
    );
  }

});

Ola.