Map not showing up

I actually followed steps in the document and got a new API key but map is still not showing up.

const AnyReactComponent = ({ text }) =>   <div style={{
    position: 'relative', color: 'white', background: 'red',
    height: 40, width: 60, top: -20, left: -30,
  }}>{text}</div>;

const Engagement = () => (
  <div className="box box-default">
    <div className="box-body">
      <div className="row">
        <GoogleMapReact defaultCenter={{lat: 59.95, lng: 30.33}} defaultZoom={11}>
        <AnyReactComponent
          lat={59.955413}
          lng={30.337844}
          text={'Kreyser Avrora'}
        />
      </GoogleMapReact>
      </div>
    </div>
  </div>
);

const Home = () => (

  <div className="container-fluid no-breadcrumbs page-dashboard">

    <QueueAnim type="bottom" className="ui-animate">
      <div key="2"><StatBoxes /></div>
      <Main />
      <div key="3"><Engagement /></div>
    </QueueAnim>

  </div>
);

[burakuluu]

@istarkov

const Engagement = () => (
  <div className="box box-default" style={{height: '948px, width: '1000px''}}>
    <div className="box-body">
      <div className="row">
        <GoogleMapReact bootstrapURLKeys={{key: 'AIzaSyBDDPW76s2PDSCZ49AeCenVyoVKfGY9TcM'}} defaultCenter={{lat: 59.95, lng: 30.33}} defaultZoom={11}>
        <AnyReactComponent
          lat={59.955413}
          lng={30.337844}
          text={'Kreyser Avrora'}
        />
      </GoogleMapReact>
      </div>
    </div>
  </div>
);

I gave the height & width but it still doesn’t appear. Did I miss something other than giving height & width attribute?

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.