Google maps 在Google Map V3中显示不带方向渲染器的路线

我试图在没有

方向渲染器的情况下绘制自己的路线

这是我的密码：

var map;
var directionsService;

function initialize() {
  var mapOptions = { mapTypeId: google.maps.MapTypeId.ROADMAP }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

  directionsService = new google.maps.DirectionsService();

  calcRoute();
}

function calcRoute() {
  var request = {
      origin: 'שדי חמד',
      destination: 'כפר סבא',
      travelMode: google.maps.TravelMode.WALKING
  };

  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      map.fitBounds(directionResult.routes[0].bounds);
      createPolyline(response);
    }
  });
}

function createPolyline(directionResult) {
  var line = new google.maps.Polyline({
      path: directionResult.routes[0].overview_path,
      strokeColor: '#FF0000',
      strokeOpacity: 0.5,
      strokeWeight: 4
  });

  line.setMap(map);

  for (var i = 0; i < line.getPath().length; i++) {
      var marker = new google.maps.Marker({
          icon: { path: google.maps.SymbolPath.CIRCLE, scale: 3 },  
          position: line.getPath().getAt(i),
          map: map
      });
  }
}

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

var映射；
var定向服务；
函数初始化（）{
var mappoptions={mapTypeId:google.maps.mapTypeId.ROADMAP}
map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
directionsService=new google.maps.directionsService（）；
calcRoute（）；
}
函数calcRoute（）{
var请求={
起源：“שיחמד”，
目的地：“•פרסבא”，
travelMode:google.maps.travelMode.WALKING
};
路由（请求、功能（响应、状态）{
if（status==google.maps.directionstatus.OK）{
map.fitBounds（directionResult.routes[0].bounds）；
创建多段线（响应）；
}
});
}
函数createPolyline（方向结果）{
var line=新的google.maps.Polyline({
路径：directionResult.routes[0]。概述\u路径，
strokeColor:“#FF0000”，
笔划不透明度：0.5，
频闪重量：4
});
line.setMap（map）；
对于（var i=0；i

我得到的只是一扇灰色的窗户，连地图都没有。

当将
方向服务的
响应发送到
方向渲染器
时，我得到两条多段线

欢迎提供任何建议。
我收到一个javascript错误“directionResult未定义”

在这一行：

  map.fitBounds(directionResult.routes[0].bounds);

如果我解决了这个问题（将其更改为响应），它就会工作


顺便说一句，我不建议使用概述路径；如果路径较长或复杂，则没有足够的细节

代码片段：


var映射；
var定向服务；
函数初始化（）{
变量映射选项={
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
directionsService=new google.maps.directionsService（）；
calcRoute（）；
}
函数calcRoute（）{
var请求={
起源：“שיחמד”，
目的地：“•פרסבא”，
travelMode:google.maps.travelMode.WALKING
};
路由（请求、功能（响应、状态）{
if（status==google.maps.directionstatus.OK）{
map.fitBounds（response.routes[0].bounds）；
创建多段线（响应）；
}
});
}
函数createPolyline（方向结果）{
var line=新的google.maps.Polyline({
路径：directionResult.routes[0]。概述\u路径，
strokeColor:“#FF0000”，
笔划不透明度：0.5，
冲程重量：4
});
line.setMap（map）；
对于（var i=0；i
html，
身体，
#地图画布{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}