Map is not loading , No errors in console. Any help?

[adorearun]

`import React, { Component } from 'react';
import { ReactBingmaps } from 'react-bingmaps';

class BingMaps extends Component {

render() {
    return (

        <div>
            sdfsdf

<ReactBingmaps

          bingmapKey = "KEY"
          center = {[13.0827, 80.2707]}
         
         
        > 
        </ReactBingmaps>
            </div>

    )
}

}

export default BingMaps;

`

[nickvanhooydonk]

The Bing Maps standard opens on 100%:
.react-bingmaps{ width: 100%; height: 100% }

The % unit is always relative to some value. I guess that in your case the % is relative to another div that has no explicit height set, so it defaults to 'auto'.

Creating an wrapper div with an explicit height fixed my case.
So my render function:
<div className={styles.container}> <ReactBingmaps bingmapKey="myKey" /> </div>

And my scss file:
.container { height: 500px; }