谷歌地图、方向和地点API生成动态方向

谷歌地图、方向和地点API生成动态方向,api,google-maps,maps,google-places-api,google-directions-api,Api,Google Maps,Maps,Google Places Api,Google Directions Api,更新代码:好的,我现在已经按照我想要的方式工作了,不过我想按距离排序附近搜索的结果 // 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.ma

更新代码:好的,我现在已经按照我想要的方式工作了,不过我想按距离排序附近搜索的结果

// 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);
更新代码结束------------------------------------------------------------------------

我希望根据目的地的特定纬度/长度生成动态方向结果,同时根据距离目的地最近的类型(火车站、公共汽车站和机场)的纬度/长度生成原点

我在某种程度上做到了这一点,因为我能够根据“500”的半径得到一个位置列表及其相关的lat/long值,但我需要修改代码,这样它只能得到每种类型最接近的结果,因此基本上是第一个找到的

我还希望能够为每种类型生成一个结果。到目前为止,我的代码是:

// 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);
编辑:使用:更接近标记,但我现在只需要获得每种类型的最接近/排名第一的结果


看起来有点凌乱和过度/不干燥,但它在一定程度上起作用。

如果您真的想要第一个结果(我不知道您是否想要):


是的,它可以作为单个搜索和原始问题答案的示例。该代码使用默认的rankBy突出度并返回第一个结果。工作示例使用rankBy距离表示公共汽车和火车,rankBy突出表示机场。它甚至使用你的坐标。。。
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);
          });
    }
}