Question

Code:

var dest1 = document.getElementById('textbox1').value;
var request = {
  origin:start,
  destination:dest1,
  travelMode: google.maps.TravelMode[selectedMode]
}

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

我正在使用谷歌API找到一个位置，然后计算搜索到的地方与来自我的数据库的特定酒店之间的距离，在图像中，您可以看到我搜索了路线图和距离＃34; Leela Palace Bengaluru，HAL Airport Road，ISRO Colony，Bengaluru，Karnataka，India＆＃34;到我的酒店来自数据库，因为你可以看到标记不完全固定在leela宫殿而不是它显示在图像标记为B的leela宫旁边。我不知道我到底做错了什么，如果有人可以帮助我，那就太好了谢谢

Map response

Answer 1

“Leela Palace Bengaluru，HAL Airport Road，ISRO Colony，Bengaluru，Karnataka，India”是一个地方，而不是邮寄地址。当您将该字符串发送到地理编码器时，您会得到“Leela Palace Rd，HAL 3rd Stage，Bengaluru，Karnataka，India（12.9619947,77.64936599999999）”的结果

距离服务使用地理编码器作为字符串，如果你给它一个地方ID，它将使用它作为目的地。

使用place id finder，“Leela Palace Bengaluru”的地点ID是：

班加罗尔里拉宫殿

地点ID：ChIJ3ZvKfAYUrjsRGuckzDe-GxE

23，HAL Airport Rd，ISRO Colony，Domlur，Bengaluru，Karnataka 560008，India

您可以将其用作DirectionsService的目的地。

proof of concept fiddle

代码段

var geocoder;
var map;

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var start = "Jogupalya, Karnataka, India";
  var dest1 = {
    placeId: "ChIJ3ZvKfAYUrjsRGuckzDe-GxE"
  };
  var request = {
    origin: start,
    destination: dest1,
    travelMode: google.maps.TravelMode.DRIVING
  }
  var directionsService = new google.maps.DirectionsService();
  var directionsDisplay1 = new google.maps.DirectionsRenderer({
    map: map,
    preserveViewport: true
  });
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay1.setDirections(response);
      map.setCenter(response.routes[0].legs[0].end_location);
      map.setZoom(16);
    }
  });
}
google.maps.event.addDomListener(window, "load", initialize);

html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>

谷歌地图标记没有正确固定

1 个答案: