Как добавить метки на карту google maps?

получил данные с api, геоданные. Как их теперь разместить на карте?

import {Map, InfoWindow, Marker, GoogleApiWrapper} from 'google-maps-react';
// Получение данных с TFL
const Http = new XMLHttpRequest();
const url = 'https://api-argon.tfl.gov.uk/BikePoint';
Http.open("GET", url);
Http.send();

Http.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var bikePoints = JSON.parse(Http.responseText);
    bikePoints.forEach(f => {
      console.log(f.lat, f.lon);
    });
  }
}
//Конец получения данных
class App extends Component {
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <h1 className="App-title">Велопарковки лондона, свободные зоны</h1>
      </header>
<div className="main-map">
        <Map google={this.props.google} 
        zoom={12}
        initialCenter={{
            lat: 51.507683,
            lng: -0.1867558
          }}>
        <Marker onClick={this.onMarkerClick}
                name={'London'} />
                <Marker
    title={'The marker`s title will appear as a tooltip.'}
    name={'SOMA'}
    position={{lat: 51.529163, lng: -0.10997}} />

 <Marker onClick={this.onMarkerClick}
                name={'London'} />
                <Marker
    title={'The marker`s title will appear as a tooltip.'}
    name={'SOMA'}
    position={{lat: 51.529163, lng: -0.10997}} />
        <InfoWindow onClose={this.onInfoWindowClose}>
            <div>
              <h1></h1>
            </div>
        </InfoWindow>
      </Map>
          </div>
          </div>
      );
    }
  }

Вот код