Javascript 从最近的标记绘制到用户定义位置的方向

目标是：

• 显示带有某些标记的地图（来自阵列或文件）
• 允许用户搜索地点/地址
• 在地图上标出那个地方
• 确定距离该位置最近的标记
• 绘制并显示从标记到位置的方向
• 如果执行了新的搜索，请更新方向

我想我很接近了。我已经从mapsapi文档中拼凑了一些代码，以及这里关于堆栈溢出的其他问题。我让它正确地标记搜索的位置并确定最近的标记，但是我很难让它更新方向标记并绘制路径

onChangeHandler

或应该触发它的侦听器是否有问题

这是我与听众讨论的最后一部分，更新并绘制新的方向

最后，我打算添加上所示的步骤

函数initMap（）{
var映射；
变量myOptions={
缩放：14，
中心：{lat:40.7484，lng:-73.9857}，
滚轮：错误，
mapTypeId:“路线图”
};
//搜索和方向图
map=new google.maps.map（document.getElementById（'map'），myOptions）；
//创建初始原点标记
//待办事项：未定义时出错
var markerA=new google.maps.Marker({
位置：{lat:40.7484，lng:-73.9857}，
地图：地图，
});
//创建位置数组并赋值
风险值locs=[]；
locs[0]=“位置1名称”、“40.73297438”、“73.97860823”]；
locs[1]=“位置2名称”，“40.72824765”，“73.98219971]”；
locs[2]=“位置3名称”、“40.73181838”、“73.97871015”]；
var infowindow=new google.maps.infowindow；
var-loc，i；
var位置=[]；
//为每个loc创建标记并将其放置在地图上
对于（i=0；i

#pac输入{
背景色：#ffffff；
字体系列：Roboto；
字体大小：15px；
字体大小：300；
左边距：12px；
边缘顶部：9px；
填充：5px11px 5px13px；
文本溢出：省略号；
宽度：400px；
}
#地图{高度：475px；}

考虑到它是从网络上捏造出来的，因此存在多个问题。这里要注意的主要问题是，我已经更新/将需求拆分为可读的函数（尽可能多）。我不会将

initMap

作为回调传递，但这应该不是问题。没有尝试验证或优化代码。只是一些小问题

我们设置了地图<