text: Q:
  
  How to change Google Maps Marker icon when user clicked the marker icon
  
  I created the Google Maps using tomchentw react-google-maps. The marker icon by default displays red marker icon, but whenever user clicks the marker icon it should change into grey marker icon and also increases the marker icon size. How can I changed it?
  <Marker
    onClick={this.MarkerClicked.bind(this,house._id)} 
    icon={{url: "/images/mapRed2.png"}} 
    position={{lat: house.location.lat, lng: house.location.lng}}
  />
  
  When my marker icon is clicked it should change its icon and size.
  
  A:
  
  The example demonstrates how to update marker icon and size once the button is clicked:  
  const Map = compose(
      withScriptjs,
      withGoogleMap,
      withStateHandlers(() => ({
          iconUrl: "http://maps.google.com/mapfiles/ms/icons/red.png",
          iconSize: new google.maps.Size(32, 32)
      }), {
              onMarkerClick: () => () => ({
                  iconUrl: "http://maps.google.com/mapfiles/ms/icons/blue.png",
                  iconSize: new google.maps.Size(64, 64)
              })
          })
  )(props =>
      <GoogleMap
          defaultZoom={8}
          defaultCenter={{ lat: -34.397, lng: 150.644 }}>
          <Marker onClick={props.onMarkerClick}
              icon={{ url: props.iconUrl, scaledSize: props.iconSize }}
              position={{ lat: -34.397, lng: 150.644 }} />
  
      </GoogleMap>
  )
  
  Key points:
  
  icon.scaledSize property is utilized to resize marker icon
  iconUrl and iconSize state properties are passed to Marker
  component once onClick event is triggered
  
  Demo
  
  