0

入力内容に応じて、英国の 3 つのクローゼット ストアを検索する JavaScript 郵便番号検索があります。現時点では、3 店舗で問題ありません。

まず、入力に入力された郵便番号にマーカーをドロップします。

次に、3 つの結果が表示されると、それらがマップ上にマークされます。クリックすると、最初から選択した店舗までの道順が表示される、方向と呼ばれるリンクが必要です。

次のコードを試しましたが、うまくいきません...ただし、入力と道順リンクから郵便番号データを取得し、コンソールに表示します。機能させるには、それらを経度と緯度に変換する必要がありますか?

function calcRoute() {
    var start = document.getElementById('address').value;
    var end = document.getElementById('get-directions').name;
    //console.log(start, end)
    var request = {
        origin:start,
        destination:end,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };
    directionsService.route(request, function(response, status) {
      if (status == google.maps.DirectionsStatus.OK) {
        directionsDisplay.setDirections(response);
      }
    });
  }

開始マーカー用にこのコードがありますが、これも機能していないようです

function initialize() {
    var start_marker = new google.maps.LatLng(document.getElementById('address').value);
    directionsDisplay = new google.maps.DirectionsRenderer();
    var mapOptions = {
      zoom:7,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: start_marker
    }
    marker = new google.maps.Marker({
          map:map,
          draggable:false,
          animation: google.maps.Animation.DROP,
          position: start_marker,
        });
    map = new google.maps.Map(document.getElementById('map'), mapOptions);
    directionsDisplay.setMap(map);
  }

この部分は、郵便番号から経度/緯度のデータを取得します。

this.geocode = function(address, callbackFunction) {
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var result = {};
      result.latitude = results[0].geometry.location.lat();
      result.longitude = results[0].geometry.location.lng();
      callbackFunction(result);
      //console.log(result);
        //console.log("Geocoding " + geometry.location + " OK");
        addMarker(map, results[0].geometry.location);
    } else {
      alert("Geocode was not successful for the following reason: " + status);
      callbackFunction(null);
    }
  });

addMarker の関数は次のとおりです。

function addMarker(map, location) {

console.log("Setting marker for (location: " + location + ")");
marker = new google.maps.Marker({
map : map,
animation: google.maps.Animation.DROP,
position : location
});

}

どんな助けでも大歓迎です！

4

1 に答える 1

0

google.maps.LatLngのコンストラクタには、文字列ではなく、引数として 2 つの浮動小数点数が必要です。

var start_marker = new google.maps.LatLng(document.getElementById('address').value);

住所しかない場合、地図上にマーカーを表示するには、 Geocoding サービスを使用してその住所の座標を取得する必要があります。

于 2012-10-24T12:15:31.667 に答える