const InfoWindowComponent = (props) => { return ( <InfoWindow onCloseClick={props.toggleClose} options={{ maxWidth: 320 }}> <div> <h3>InfoWindow</h3> <p> A tree needs to be your friend if you're going to paint him. The only prerequisite is that it makes you happy. If it makes you happy then it's good. I thought today we would do a happy little picture. This present moment is perfect simply due to the fact you're experiencing it. Work on one thing at a time. Don't get carried away - we have plenty of time. I really believe that if you practice enough you could paint the 'Mona Lisa' with a two-inch brush. </p> </div> </InfoWindow> ); }
withGoogleMap(props => ( <GoogleMap ref={props.onMapLoad} defaultZoom={props.defaultZoom} defaultCenter={props.defaultCenter} > {props.markers.map((marker, index) => ( <Marker {...marker}> { marker.key === props.activeMarker ? <InfoWindow {...marker.infoWindow} > <span> <b>{marker.marker.venue}</b> {genInfoWindow(marker.marker)} </span> </InfoWindow> : null } </Marker> ))} </GoogleMap> ))
const CustomInfoWindow = ({ lat, lng, as, ips, country, regionName, city, org, hostname, onClose }) => ( <InfoWindow position={{ lat, lng }} onCloseClick={onClose} > <ul className={styles.infoWindow}> <li><b>Location:</b>{[...new Set([regionName, city, country])].join(' ')}</li> <li> <b>IP{ips.length > 1 && `(${ips.length})`}:</b> <pre>{ips.join('\n')}</pre> </li> {hostname && ( <li> <b>Host{hostname.length > 1 && `(${hostname.length})`}:</b> <pre>{hostname.join('\n') || '-'}</pre> </li> )} <li><b>AS:</b>{as || '-'}</li> <li><b>Org:</b>{org || '-'}</li> </ul> </InfoWindow> )
onClick={props.onToggleOpen} <InfoWindow onCloseClick={props.onToggleOpen}> prueba </InfoWindow>