0

更新されたコード: わかりました、私は今、私が望むようにこれを機能させていますが、nearBy 検索の結果を距離で並べ替えたいと考えています。

// Google Maps
var lat = $('#map').data('lat');
var lng = $('#map').data('lng');

var markerImage = {
    url: '/img/marker.png'
}

var eventTitle = $('.title').data('event-title');
var latLng = new google.maps.LatLng(lat, lng);
var trainDisplay = new google.maps.DirectionsRenderer();
var trainService = new google.maps.DirectionsService();
var busDisplay = new google.maps.DirectionsRenderer();
var busService = new google.maps.DirectionsService();
var airportDisplay = new google.maps.DirectionsRenderer();
var airportService = new google.maps.DirectionsService();

function initialise() {

    var mapOptions = {
        zoom: 15,
        center: latLng
    };

    map = new google.maps.Map(document.getElementById('map'), mapOptions);

    trainDisplay.setPanel(document.getElementById('train'));
    busDisplay.setPanel(document.getElementById('bus'));
    airportDisplay.setPanel(document.getElementById('airport'));

    var marker = new google.maps.Marker({
        position: latLng,
        map: map,
        title: eventTitle,
        icon: markerImage
    });

    var trainRequest = {
        location: latLng,
        radius: '500',
        types: ['train_station']
    };

    var busRequest = {
        location: latLng,
        radius: '500',
        types: ['bus_station']
    };

    var airportRequest = {
        location: latLng,
        radius: '50000',
        types: ['airport']
    };

    var train = new google.maps.places.PlacesService(map);
    var bus = new google.maps.places.PlacesService(map);
    var airport = new google.maps.places.PlacesService(map);

    train.nearbySearch(trainRequest, trainRoute);
    bus.nearbySearch(busRequest, busRoute);
    airport.nearbySearch(airportRequest, airportRoute);
}

function trainRoute(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        var request = {
            origin: results[0].geometry.location,
            destination: latLng,
            travelMode: google.maps.TravelMode.WALKING
        };
        var name = ' ' + results[0].name;
        $('#train h3').append(name);
        trainService.route(request, function(response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                trainDisplay.setDirections(response);
            }
        });
    }
}

function busRoute(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        var request = {
            origin: results[0].geometry.location,
            destination: latLng,
            travelMode: google.maps.TravelMode.WALKING
        };
        var name = ' ' + results[0].name;
        $('#bus h3').append(name);
        busService.route(request, function(response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                busDisplay.setDirections(response);
            }
        });
    }
}

function airportRoute(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        var request = {
            origin: results[0].geometry.location,
            destination: latLng,
            travelMode: google.maps.TravelMode.DRIVING
        };
        var name = ' ' + results[0].name;
        $('#airport h3').append(name);
        airportService.route(request, function(response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                airportDisplay.setDirections(response);
            }
        });
    }
}

google.maps.event.addDomListener(window, 'load', initialise);

更新コードの終わり -------------------------------------------------- -------------------------------------------------- -

目的地に最も近いタイプ (train_station、bus_station、および空港) の緯度/経度に基づいて出発地を生成しながら、目的地の特定の緯度/経度に基づいて動的なルート案内の結果を生成したいと考えています。

「500」の半径に基づいて、場所のリストとそれに関連する緯度/経度の値を取得できるように、途中まで来ましたが、コードを変更して、最も近い結果のみが得られるようにする必要がありますそれぞれのタイプなので、基本的には最初に見つかったものです。

また、タイプごとに結果を生成できるようにしたいと思います。これまでの私のコードは次のとおりです。

// Google Maps
var lat = $('#map').data('lat');
var lng = $('#map').data('lng');

var markerImage = {
    url: '/img/marker.png'
}

var eventTitle = $('.title').data('event-title');
var latLng = new google.maps.LatLng(lat, lng);
var directionsDisplay = new google.maps.DirectionsRenderer();
var directionsService = new google.maps.DirectionsService();

function initialise() {

    var mapOptions = {
        zoom: 15,
        center: latLng
    };

    map = new google.maps.Map(document.getElementById('map'), mapOptions);

    directionsDisplay.setMap(map);
    directionsDisplay.setPanel(document.getElementById('directions'));

    var marker = new google.maps.Marker({
        position: latLng,
        map: map,
        title: eventTitle,
        icon: markerImage
    });

    var request = {
        location: latLng,
        radius: '500',
        types: ['train_station']
    };

    var service = new google.maps.places.PlacesService(map);

    service.nearbySearch(request, calcRoute);
}

function calcRoute(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        for (var i = 0, result; result = results[i]; i++) {
            var directionsRequest = {
                origin: result.geometry.location,
                destination: latLng,
                travelMode: google.maps.TravelMode.WALKING
            };
            directionsService.route(directionsRequest, function(response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                }
            });
        }
    }
}

google.maps.event.addDomListener(window, 'load', initialise);

編集: http://paste.laravel.com/1eHKでマークに近づきますが、各タイプの最も近い/最初の結果のみを取得する必要があります。

少し面倒でやり過ぎ/DRYではないようですが、ある程度は機能します。

4

1 に答える 1

1

あなたが本当に最初の結果が欲しいなら（私はあなたがそうしていることを知りません）：

function calcRoute(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
          var directionsRequest = {
              origin: results[0].geometry.location,
              destination: latLng,
              travelMode: google.maps.TravelMode.WALKING
          };
          directionsService.route(directionsRequest, function(response, status) {
              if (status == google.maps.DirectionsStatus.OK) {
                  directionsDisplay.setDirections(response);
              } 
              else alert ("Directions request failed:"+status);
          });
    }
}

実施例

于 2013-12-16T14:38:28.320 に答える