CODEWITHSUNDEEP
jquerydictionary
cfz
cfz

Reputation: 343

Google Map does not display the whole map

I have a problem with google map..the case is, it will not load the whole map but only a part of the map and the rest it's blank already..what could be the problem?..

here's the code..

<div id="map_addresses" class="map">
    <p>This will be replaced with the Google Map.</p>
</div>


$(function()
{

   $('#map_addresses').gMap({
        controls: {
        panControl: true,
        zoomControl: true,
        mapTypeControl: true,
        scaleControl: true,
        streetViewControl: true,
    },
        scrollwheel: true,
        zoom: 5,
         maptype: 'ROADMAP',
        markers:[
            {
                latitude: 10.318577,
                longitude: 123.908062,
                html: "Jinisys Software Inc. Sales Office"
            },
            {
                latitude: 10.324213,
                longitude: 123.911546,
                html: "Jinisys Software Inc. Main Office"
            }

        ]
    });
}

Upvotes: 0

Views: 249

Answers (1)

ATOzTOA
ATOzTOA

Reputation: 36000

Google map can only be loaded on to a visible div. Also, the width and height of the element have to be fixed. The map won't resize the div.

Try this:

<style>
    .map{
        width:400px;
        height:400px;
    }
</style>

<div id="map_addresses" class="map">
    <p>This will be replaced with the Google Map.</p>
</div>

Upvotes: 2

Related Questions