CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
omkar sahu
omkar sahu

Reputation: 19

Google Map default zoom issue

Google Map default zoom issue. Default zoom level not working. I change the zoom value but it is not responding. Please help me regarding this issue. Thank you in advance. Please help me regarding this issue. 

<script src="http://maps.google.com/maps/api/js?key=AIzaSyDrUSGOXq4cTcc15LplHJshcnGM981dEoQ&sensor=false" type="text/javascript"></script>
        <script type="text/javascript">
            //Sample code written by August Li
            var icon = new google.maps.MarkerImage("images/placeholder.png",
                       new google.maps.Size(32, 32), new google.maps.Point(0, 0),
                       new google.maps.Point(13, 32));
            var center = null;
            var map = null;
            var currentPopup;
            var bounds = new google.maps.LatLngBounds();
            function addMarker(lat, lng, info) {
                var pt = new google.maps.LatLng(lat, lng);
                bounds.extend(pt);
                var marker = new google.maps.Marker({
                    position: pt,
                    icon: icon,
                    map: map
                });
                var popup = new google.maps.InfoWindow({
                    content: info,
                    maxWidth: 300
                });
                google.maps.event.addListener(marker, "click", function() {
                    if (currentPopup != null) {
                        currentPopup.close();
                        currentPopup = null;
                    }
                    popup.open(map, marker);
                    currentPopup = popup;
                });
                google.maps.event.addListener(popup, "closeclick", function() {
                    map.panTo(center);
                    currentPopup = null;
                });
            }           
            function initMap() {
                map = new google.maps.Map(document.getElementById("map"), {
                    center: new google.maps.LatLng(0, 0),
                    zoom: 5,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    mapTypeControl: false,
                    mapTypeControlOptions: {
                        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                    },
                    navigationControl: true,
                    navigationControlOptions: {
                        style: google.maps.NavigationControlStyle.ZOOM_PAN
                    }
                });
<?php
$query = mysql_query("SELECT * FROM locations WHERE ClinicId=$location_id")or die(mysql_error());
while($row = mysql_fetch_array($query))
{
  $name = $row['ClinicName'];
  $lat = $row['ClinicLatitude'];
  $lon = $row['ClinicLongitude'];
  $desc = $row['ClinicAddress'];



  echo("addMarker($lat, $lon, '<b>$name</b><br />$desc');\n");

}

?>
 center = bounds.getCenter();
     map.fitBounds(bounds);

     }
     </script>
 #map { width: 100%; height: 300px; border: 0px; padding: 0px; }
<div id="map"></div>

Upvotes: 0

Views: 928

Answers (1)

User 123
User 123

Reputation: 393

Try this one .. it will work In script:

var myCenter=new google.maps.LatLng(10.123,11.989);
var marker;

function initialize()
{
    var mapProp = {
    center:myCenter,
    zoom:5,
    mapTypeId:google.maps.MapTypeId.ROADMAP 
   };

    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

    var marker=new google.maps.Marker({
    position:myCenter,
    animation:google.maps.Animation.BOUNCE
  });

   marker.setMap(map);
}

In html:

 <div id="googleMap" style="width:1400px;height:620px;">

Upvotes: 1

Related Questions