title: Dynamically Adding Markers on google-map-react
body: <p>What I wan't to do is to show the location picked from some mobile devices on the Map.
  Data about the locations are there.. </p>
  
  <p>What I need here is to add Markers on the map depending on the data received from the server. </p>
  
  <p>Assume I have set the location data <strong>({Lat,Lang})</strong> to the <strong>state markers</strong> 
  Then How can I add this to show in Map.</p>
  
  <p>My Map Code is as follows!</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>import React, { Component } from 'react';
  import GoogleMapReact from 'google-map-react';
  
  const AnyReactComponent = ({ text }) =&gt; &lt;div&gt;{text}&lt;/div&gt;;
  
  class MyClass extends Component {
    constructor(props){
      super(props);
  
    }
  
    render() {
      return (
        &lt;GoogleMapReact
          defaultCenter={this.props.center}
          defaultZoom={this.props.zoom}
          style={{height: '300px'}}
        &gt;
          &lt;AnyReactComponent
            lat={59.955413}
            lng={30.337844}
            text={'Google Map'}
          /&gt;
        &lt;/GoogleMapReact&gt;
      );
    }
  }
  MyClass.defaultProps = {
    center: {lat: 59.95, lng: 30.33},
    zoom: 11
  };
  
  export default MyClass;</code></pre>
  </div>
  </div>
  </p>
  
  <p>This Code is from the answer <a href="https://stackoverflow.com/questions/43580092/implementing-google-maps-with-react">Implementing google maps with react</a> </p>
  
  <p>Used npm package :- google-map-react</p>