0

在这篇文章之后,我正在尝试使用 Google Mps API 获取两个位置之间的距离。我还找到了以下示例

我已经集成了相同的代码,但我没有看到任何结果。我在这里做错了什么?

任何人都可以让我知道已为 Google Maps APIv3 指示示例的任何链接吗?

  <html>
  <head>
  <style>
  h1{
      font-family:arial,helvetica,sans-serif;
      font-size:20px;
      font-weight:bold;
  }
  p{
      font-family:arial,helvetica,sans-serif;
  }
  </style>
  <script include="/home/rajeev/Desktop/ge/jquery-1.7.2.js"></script>
  <script>
  var map;
      var marker, marker2;
      function initialize() {
          var mapDiv = document.getElementById('map-canvas');
          map = new google.maps.Map(mapDiv, {
              center: new google.maps.LatLng(-36.86501268451408, 174.723858833313),
              zoom: 16,
              mapTypeId: google.maps.MapTypeId.ROADMAP
          });
      }

      $(function() {
          initialize();

         var geocoder = new google.maps.Geocoder();

         //Geocode the first address
         geocoder.geocode({
            address : '27 West View Road Westmere Auckland New Zealand',
            region: 'no'
         }, function(results, status){
            //Create the first marker
            marker = new google.maps.Marker({
                position: new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng()),
                map: map,
            });

            //Now geocode the second address
            geocoder.geocode({
              address : '37 Old Mill Road Westmere Auckland New Zealand',
              region: 'no'
            }, function(results, status){
              //Create the second marker
              marker2 = new google.maps.Marker({
                  position: new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng()),
                  map: map,
              });

              //Now create the line (we have both markers at this point guaranteed)
              var line = new google.maps.Polyline({
                path: new Array(marker.getPosition(),marker2.getPosition()),
                strokeColor: '#ff0000',
                strokeOpacity: 1.0,
                strokeWeight: 2
              });

              line.setMap(map);

              //Now calculate the distance
              var R = 6371; // km
              var dLat = (marker.getPosition().lat() - marker2.getPosition().lat()).toRad();
              var dLon = (marker.getPosition().lng()- marker2.getPosition().lng()).toRad();
              var lat1 = marker2.getPosition().lat().toRad();
              var lat2 = marker.getPosition().lat().toRad();
              var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) + Math.sin(dLon / 2) * Math.sin(dLon / 2) * Math.cos(lat1) * Math.cos(lat2);
              var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
              var distance = Math.ceil(R * c * 1000);
                $('p').html('The distance between the two addresses is:' + distance +'m');  
            });
         });
      });

    if (typeof(Number.prototype.toRad) === "undefined") {
      Number.prototype.toRad = function() {
        return this * Math.PI / 180;
      }
    }


  </script>
  </head>
  <body>

  <h1>Distance polyline between two street addresses</h1>
  <hr/>
  <p>
      </p>
  <hr/>
  <div id="map-canvas" style="width:500px;height:500px"></div>
  </body>
4

1 回答 1

1

这是不正确的

<script include="/home/rajeev/Desktop/ge/jquery-1.7.2.js"></script>

利用

<script src="/home/rajeev/Desktop/ge/jquery-1.7.2.js"></script>

此外,包括 Google Maps API

<script src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>

您还可以使用来自 Google CDN 的 jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
于 2012-06-14T08:26:45.260 回答