CODEWITHSUNDEEP
google-maps-api-3
user3317346
user3317346

Reputation: 3

google map not displaying on my webpage

Here is code snippet. Please someone help me as i am unable to get the map running on my webpage. I have tried everything i know but that's also of no use...

the map is not displaying anything on my webpage...

http://jsfiddle.net/gauravroy142/tZ7v2/

<head>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
 function initialize() {
  var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
  var mapOptions = {
    zoom: 12,
    center: myLatlng
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: 'Hello World!'
  });
}

google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>


<div id="contact-right">

<div class="panel-pane pane-block pane-amazeelabs-google-map" id="map">
  <!--<div class="map">-->
    <div id="map-canvas"></div>  <!--</div>-->

  </div>


  <!--<div class="map">-->

    <div id="address">
    <p>Roy-Coy<br>
    Varanasi-221007<br>
    Uttar Pradesh<br>
    India</p>
    </div>
    <div id="we-are-waiting-for-you">
    <p id="tlf">+91 9805 463 715</p><br>
    <p id="email"><a class="spamspan" href="mailto:[email protected]">[email protected]</a></p><br>
<p id="twitter"><a href="http://twitter.com/gauravroy11">@gauravroy11</a></p>
</div>
<p>&nbsp;</p>
  <!--</div>-->
  </div> 
  </body>

I have checked the api documentation also but that also of no use... The map is not displaying anything.

Upvotes: 0

Views: 153

Answers (1)

geocodezip
geocodezip

Reputation: 161384

Your map div, #map-canvas(not #map), doesn't have a size.

#map-canvas {

    width:200px;
    height:200px;
}

Working fiddle

Upvotes: 1

Related Questions