0

Google マップの API に問題があります。ユーザーの位置と、前に付けられた別のポイントへのルートを示すマップをサイトに追加する必要があります。

1) リクエストの「起点」であるジオローカリゼーションからの変数 pos を指定できません。

2) 2 つのマーカーを見るための正確な距離で自動ズームを行うことができません。

これは私のコードです:

var directionsService = new google.maps.DirectionsService();
var directionsDisplay = new google.maps.DirectionsRenderer();

var request = {
    travelMode: google.maps.DirectionsTravelMode.DRIVING
  };

//Initializing map
var initialize = function() {

  // Taking the address of school
  var address = document.getElementById('address').firstChild.nodeValue;
  var city = document.getElementById("city").firstChild.nodeValue;
  var comun = document.getElementById("comun").firstChild.nodeValue;
  var search = address + " " + city + " " + comun; 

  // Initializing the geocoder and searcing the address in search
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode( {'address': search}, function(results,status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var marker2 = new google.maps.Marker({ 
        position: results[0].geometry.location,
        map: map,
        title: 'Posizione scuola'
      });
    } else {
      alert("Problema nella ricerca dell'indirizzo: " + status);
    }
  });

  // Input the visualization options
  var options = { 
    zoom: 12,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    disableDefaultUI: true
  };

  // Create the map
  var map = new google.maps.Map(document.getElementById('maps'), options);

  // Try HTML5 geolocation
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
      map.setCenter(pos);
      request.origin = (map.center);
      // Put the marker
      var marker = new google.maps.Marker({ 
        position: pos,
        map: map,
        title: 'Tua posizione'
      });
    });
  } else {
    alert("Il tuo dispositivo non permette di visualizzare la tua posizione");
  } 

  directionsDisplay.setMap(map);
  calcRoute();
} // End initialize

var calcRoute =function() {

  // Taking the address of school
  var address = document.getElementById('address').firstChild.nodeValue;
  var city = document.getElementById("city").firstChild.nodeValue;
  var comun = document.getElementById("comun").firstChild.nodeValue;
  var search = address + " " + city + " " + comun; 

  request.destination = search;

  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });
}

window.onload = initialize;

ご協力ありがとうございました

4

1 に答える 1

0

calcRoute1.) の呼び出しをの成功コールバックに移動する必要がありますgetCurrentPosition(ジオロケーティングは非同期プロセスであり、現在、request.origin呼び出し時にまだ設定されていませんcalcRoute)

if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
      map.setCenter(pos);
      request.origin = (pos);
      // Put the marker
      var marker = new google.maps.Marker({ 
        position: pos,
        map: map,
        title: 'Tua posizione'
      });
      directionsDisplay.setMap(map);
      calcRoute();
    });
  } else {
    alert("Il tuo dispositivo non permette di visualizzare la tua posizione");
  } 
}

2.) 1.) を修正すると動作します。

于 2013-07-22T11:17:01.753 に答える