CODEWITHSUNDEEP
azuremapsazure-maps
Leonardo Gomes
Leonardo Gomes

Reputation: 11

Azure Maps - Map is not opening at the correct size

I have a page with azure maps, and most of the time it loads normally and the map covers the entire screen. But at some points when refreshing the page, the map is limited to a small size, and if I just refresh the screen or even open the browser console, the size is updated correctly.

<body>
    <div id="mapDiv"></div>
</body>

I even created an event in an attempt to make a resize

map.events.add('ready', function () {
        setTimeout(function () {
            map.map.resize();
        }, 1000);
    });

Error enter image description here

when i refresh or open da console enter image description here

Upvotes: 1

Views: 1303

Answers (1)

rbrundritt
rbrundritt

Reputation: 17954

If it is meant to be full screen, make sure to set the width/height to 100% for not only the map, but the html and body tags as well. When you don't specify any styles for the map div, it inherits from it's parents. Try adding this CSS to your page:

html, body, #mapDiv {
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;
}

Upvotes: 0

Related Questions