Google map get refresh when click on marker to open infowindo

I have an issue with react-google-maps. When i click on a marker so infowindo opens but the google map get refresh, it reset its default zoom. but i want if any user make zoom map and then click marker so map should not reset with its default zoom , it should stay zoom which user make to see marker. Simply i want that map should not refresh after click on marker

here is code class Map extends Component { constructor(props) {

  super(props);
 
  this.state = {
    showm:''
    
  }
}



handleToggleOpen (id) {

  this.setState({
    showm:id
  });
}

handleToggleClose () {
  this.setState({
    showm:''
  });
}

render() { const GoogleMapExample = withGoogleMap(props => ( <GoogleMap defaultCenter = { { lat: 40.752307, lng: -73.912304 } } defaultZoom = { 10 } > {this.props.information.map(marker => (

        <Marker
          position={{ lat: parseFloat(marker.latitude) , lng:parseFloat(marker.longitude)  }}
          
          onClick={() => this.handleToggleOpen(marker.id)}
        >
          {
        this.state.showm === marker.id &&
       <InfoWindow onCloseClick={this.props.handleCloseCall} defaultOptions= {{ position: [parseFloat(marker.latitude) ,parseFloat(marker.longitude)] }}>
          <div style={{width:'300px' }}>
            <table>
            <tr>
              <td>
                <div className="" style={{padding:'0px' }}>
                  <img style = {{width:'100%','margin-top':'0px'}} alt="" src={"public/uploads/profile_image/" + marker.image} />
                </div>
              </td>
              <td>&nbsp;&nbsp;&nbsp;</td>
              <td>
                <div className="" style={{'margin-top':'7px' }}>
                  <p>Name:{marker.shop_name}</p>
                  <p>Distance:{marker.distance.toFixed(2)}</p>
                  <p>Address:{marker.address}</p>
                </div>
              </td>
            </tr>
            </table>
            
            
          </div>
         
       </InfoWindow>
      }
        </Marker>

    ))}

    
  	
  </GoogleMap>

)); return( <div> <GoogleMapExample containerElement={ <div style={{ height: 650px, width: ‘500px’ }} /> } mapElement={ <div style={{ height: 100% }} /> } /> </div> ); } };

[nicolasard]

Hello!, i was following an example in the doc (https://tomchentw.github.io/react-google-maps/) and i found a way to fix the issue that i had about the reload of the whole map, i wrote my own example in https://codesandbox.io/s/q4vnjyknmj i was declaring the MyMapComponent inside the class, when i move it outside the map area stop to reload after a setState(). Hope this help you. @kapilideal @themakerman

[pesta]

thanks @nicolasard that fixed it for me