Home/ Questions/Q 8203189
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T07:27:56+00:00

The map displays 2 markers, one with geolocation coordinates and the other one with

  • 0

The map displays 2 markers, one with geolocation coordinates and the other one with some random coordinates. I can’t extend the bounds to fit both markers in the map. What’s wrong? thank you in advance.

<!DOCTYPE html>
<html>
  <head>
    <title>Google Maps JavaScript API v3 Example: Map Geolocation</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=yes">
    <meta charset="UTF-8">
    <link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css"
      rel="stylesheet" type="text/css">

    <script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?sensor=true"></script>

    <script type="text/javascript">
      var map;

      function initialize() {
        var myOptions = {
          zoom: 18,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),
            myOptions);

        // Try HTML5 geolocation
        if(navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function(position) {
            var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
            var geolocation = new google.maps.Marker({position: pos, map: map, title: 'Your geolocation', });

            var latitude=47.03249;
            var longitude=28.833747;
            var pos2=new google.maps.LatLng(latitude,longitude);
            var geolocation2 = new google.maps.Marker({position: pos2,map: map,title: 'Your geolocation',});

            var pos3=new google.maps.LatLng((position.coords.latitude+latitude)/2,(position.coords.longitude+longitude)/2);
            map.setCenter(pos3);

            bounds.extend(geolocation.getPosition());              
            bounds.extend(geolocation2.getPosition());  

    map.fitBounds(bounds);

            }, 
            function() {handleNoGeolocation(true);});
        } 
        else {handleNoGeolocation(false);
        }

      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas" style='width:400px; height:400px;'></div>
  </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    your bounds needs to be a google.maps.LatLngBounds object.
    You don’t ever construct it.

    Add (somewhere before you call extend on it):

    var bounds = new google.maps.LatLngBounds();

    BTW – you should be getting javascript errors that make this really clear.

    • 0