谷歌地图API - 最近点 - 更改排序顺序 [英] Google Maps API - Closest points - Changing the sort order

查看：455 发布时间：2016/5/22 20:45:45 javascript api google-maps-api-3 google-api maps

本文介绍了谷歌地图API - 最近点 - 更改排序顺序的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在不同地点的一些员工。当我收到了一份工作，我想它分配给最近的员工。因此，在这种情况下，分配是拉链code 06810.下面首先目前的code行列使用纬度和经度的直线距离。然后，使用谷歌的方向，在英里的实际行驶距离计算，但仍用直线距离来分类的。我想通过实际驾驶距离来分类的像在第二组的结果。任何人都知道如何做到这一点？谢谢

 原创性成果 -  http://vince.netau.net/vince.html使用Zip code 06810
仁亚历山大流程3：41.159977，-73.982356：50348.52 54.3英哩
理查德·亨德森过程11：40.858696，-73.297249：59009.38 92万里
吉姆·托马斯进程0：41.041599，-74.019554：60252.91 55.5英哩
唐詹姆斯过程2：40.997704，-74.050598：65365.08 59.5英哩
约翰·史密斯流程1：40.986584，-74.290207：82405.22 74英里
铝邦迪过程8：40.804319，-74.122668：84834.76 71.2英哩
蒂姆·海格过程7：40.691845，-73.969104：87569.35 69.9英哩
肯罗伯茨过程5：40.754302，-74.409713：105950.12 92.8英哩
文斯Patera过程9：40.562019，-74.452335：123497.86 101万里
托马斯·格伦过程10：40.291759，-74.343231：142031.60 109英里
汤姆·琼斯过程4：40.001475，-75.0268：202567.94 153万里
凯文·詹姆斯过程6：39.82534，-74.919937：212467.19 155英里结果我想
仁亚历山大流程3：41.159977，-73.982356：50348.52 54.3英哩
吉姆·托马斯进程0：41.041599，-74.019554：60252.91 55.5英哩
唐詹姆斯过程2：40.997704，-74.050598：65365.08 59.5英哩
蒂姆·海格过程7：40.691845，-73.969104：87569.35 69.9英哩
铝邦迪过程8：40.804319，-74.122668：84834.76 71.2英哩
约翰·史密斯流程1：40.986584，-74.290207：82405.22 74英里
理查德·亨德森过程11：40.858696，-73.297249：59009.38 92万里
肯罗伯茨过程5：40.754302，-74.409713：105950.12 92.8英哩
文斯Patera过程9：40.562019，-74.452335：123497.86 101万里
托马斯·格伦过程10：40.291759，-74.343231：142031.60 109英里
汤姆·琼斯过程4：40.001475，-75.0268：202567.94 153万里
凯文·詹姆斯过程6：39.82534，-74.919937：212467.19 155英里

code：

 ＆LT;！DOCTYPE HTML＆GT;
 ＆LT; HTML和GT;
   ＆LT; HEAD＆GT;
     ＆LT;标题＆GT;谷歌地图JavaScript API v3示例：简单＆LT地图; /标题＆GT;
     ＆LT; META NAME =视口CONTENT =WIDTH =设备宽度，初始规模= 1.0，用户可扩展性=无＆GT;
     ＆LT;间的charset =UTF-8＆GT;
     ＆LT;风格＆GT;
       HTML，身体，#map_canvas {
         保证金：0;
         填充：0;
         高度：100％;
       }
     ＆LT; /风格＆GT;
＆所述; SCRIPT SRC =https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false＆GT;＆下; /脚本＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
//商店名称[0]，交货[1]，地址[2]，交货区[3]，坐标[4]从FusionTables比萨饼店示例数据
VAR位置= [
[吉姆·托马斯，无，12·威廉斯路的Montvale， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.118874,37.45224,0 -122.107544,37.437793,0 -122.102737,37.422526,0 -122.113037,37.414618,0 -122.121277,37.386799,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"41.041599,-74.019554\",\"http://maps.google.com/mapfiles/ms/icons/blue.png\"],
[约翰·史密斯，是，8克雷格广场，Pompton湖， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.200928,37.438611,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.144623,37.475948,0 -122.164192,37.481125,0 -122.189255,37.478673,0 -122.208481,37.468319,0 -122.201271,37.438338,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.986584,-74.290207\",\"http://maps.google.com/mapfiles/ms/icons/green.png\"],
[唐詹姆斯，没有，689芬街，华盛顿乡， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.300835,37.505096,0 -122.262383,37.481669,0 -122.242813,37.502917,0 -122.244186,37.534232,0 -122.269249,37.550021,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.997704,-74.050598\",\"http://maps.google.com/mapfiles/ms/icons/red.png\"],
[仁亚历山大，是，45遗产博士，新城， NY\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.281609,37.570433,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"41.159977,-73.982356\",\"http://maps.google.com/mapfiles/ms/icons/yellow.png\"],
[汤姆·琼斯，是，263 W.宽广的St，巴尔米拉， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.374306,37.548933,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.359543,37.59764,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.374306,37.548933,0＆LT; /coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.001475，-75.026800，http://maps.google.com/mapfiles/ms/icons/blue.png]，
[肯罗伯茨，是，169主街，麦迪逊， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.462883,37.628916,0 -122.445374,37.639247,0 -122.426147,37.648762,0 -122.405205,37.642238,0 -122.400055,37.628644,0 -122.392159,37.610696,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.462196,37.628644,0＆LT; /coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.754302，-74.409713，http://maps.google.com/mapfiles/ms/icons/green.png]，
[凯文·詹姆斯，是，90滕比蔡斯医生，沃里斯， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.43576,37.790795,0 -122.449493,37.801646,0 -122.425461,37.809784,0 -122.402115,37.811411,0 -122.390442,37.794593,0 -122.408295,37.79188,0 -122.434387,37.789167,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆LT; / outerBoundaryIs＆GT ;＆所述; /多边形＆gt;中，39.825340，-74.919937，http://maps.google.com/mapfiles/ms/icons/green.png]，
[添海格，是，208克林顿大道，布鲁克林， NY\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.463398,37.760266,0 -122.477349,37.774785,0 -122.427349,37.774785,0 -122.429237,37.763658,0 -122.46357,37.760808,0</coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.691845, -73.969104，http://maps.google.com/mapfiles/ms/icons/green.png]，
[阿尔邦迪，是，554页大道，摆花街， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.418766,37.747779,0 -122.425289,37.768951,0 -122.406063,37.769901,0 -122.406063,37.749679,0 -122.418251,37.747508,0＆下; /坐标＆GT;＆下; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，40.804319， - 74.122668，http://maps.google.com/mapfiles/ms/icons/green.png]，
[文斯Patera，是，12玛丽莎CT，皮斯卡塔韦， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.108917,37.362244,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.069778,37.3898,0 -122.076645,37.402619,0 -122.078705,37.411619,0 -122.113037,37.414618,0 -122.121277,37.386799,0＆LT; /coordinates></LinearRing></outerBoundaryIs></Polygon>\",\"40.562019，-74.452335，http://maps.google.com/mapfiles/ms/icons/green.png]，
[托马斯·格伦，无，8泰勒米尔斯路，马纳拉潘， NJ\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.047119,37.33113,0 -122.065315,37.332495,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.036819,37.385162,0 -122.006607,37.382162,0 -122.00386,37.342048,0 -122.047119,37.331403,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，40.291759，-74.343231，http://maps.google.com/mapfiles/ms/icons/blue.png]，
[理查德·亨德森，无，27布尔LN，东诺斯波特， NY\",\"<Polygon><outerBoundaryIs><LinearRing><coordinates>-121.935196,37.345051,0 -121.931076,37.294267,0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.798553,37.361426,0 -121.879578,37.36088,0 -121.934509,37.345597,0 -121.935196,37.345051,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，40.858696，-73.297249，http://maps.google.com/mapfiles/ms/icons/yellow.png]，
];
//警报（locations.length）;VAR地理codeR = NULL;
VAR地图= NULL;
VAR customerMarker = NULL;
变种gmarkers = [];
变种最接近= [];
VAR directionsDisplay =新google.maps.DirectionsRenderer（）;;
VAR为DirectionsService =新google.maps.DirectionsService（）;
VAR地图;函数初始化（）{
//警报（INIT）;
  地理codeR =新google.maps.Geo codeR（）;
  地图=新google.maps.Map（的document.getElementById（地图），
        {
            变焦：9，
            中心：新google.maps.LatLng（52.6699927，-0.7274620）
            mapTypeId设为：google.maps.MapTypeId.ROADMAP
        }）;
  VAR信息窗口=新google.maps.InfoWindow（）;
  VAR标记，我;
  VAR边界=新的google.maps.LatLngBounds（）;
  的document.getElementById（信息）的innerHTML =发现+ locations.length +的位置＆LT; BR＆gt;中。
  对于（i = 0; I＆LT; locations.length;我++）{
            VAR coordStr =位置[I] [4];
        变种COORDS = coordStr.split（，）;
        VAR PT =新google.maps.LatLng（parseFloat（COORDS [0]），parseFloat（COORDS [1]））;
            bounds.extend（PT）;
            标记=新google.maps.Marker（{
                            位置：PT，
                            地图：地图，
                图标：位置由[i] [5]，
                            地址：位置由[i] [2]，
                            标题：位置[I] [0]，
                            HTML：位置[I] [0] +＆LT; BR＆gt;中+位置[I] [2] +＆LT; BR＆GT;＆LT; BR＆GT;＆LT;一href='javascript:getDirections(customerMarker.getPosition(),&quot;\"+locations[i][2]+\"&quot;);'>Get地图＆LT; / A＆gt;中
                            }）;
            gmarkers.push（标记）;
            google.maps.event.addListener（标记，'点击'，（功能（标记，I）{返回功能（）
            {infowindow.setContent（marker.html）;
                        infowindow.open（地图，标记）;
            }
        }）
        （标记，I））;
    }
    map.fitBounds（边界）;}      功能codeAddress（）{
        VAR地址=的document.getElementById（'地址'）值。
        地理coder.geo code（{'地址'：地址}，功能（结果状态）{
          如果（状态== google.maps.Geo coderStatus.OK）{
            map.setCenter（结果[0] .geometry.location）;
        如果（customerMarker）customerMarker.setMap（NULL）;
            customerMarker =新google.maps.Marker（{
                地图：地图，
                位置：结果[0] .geometry.location
            }）;
        最接近= findClosestN（结果[0] .geometry.location，12）;
            //获取行驶距离
            最接近= closest.splice（0,12）;
            calculateDistances（结果[0] .geometry.location，最近，12）;
          }其他{
            警报（'地理code不成功，原因如下：'+状态）;
          }
        }）;
      }功能findClosestN（PT，numberOfResults）{
   变种最接近= [];
   的document.getElementById（信息）的innerHTML + =处理+ gmarkers.length +。＆LT; BR＆gt;中;
   对于（VAR I = 0; I＆LT; gmarkers.length;我++）{
     gmarkers [I] .distance = google.maps.geometry.spherical.computeDistanceBetween（PT，gmarkers [I] .getPosition（））;
     。的document.getElementById（'信息'）的innerHTML + =过程+ I +：+ gmarkers [I] .getPosition（）toUrlValue（6）+：+ gmarkers [I] .distance.toFixed（2） +＆LT; BR＆gt;中;
     gmarkers [I] .setMap（NULL）;
     closest.push（gmarkers [I]）;
     closest.sort（sortByDist）;
   }   返回最接近;
}功能sortByDist（A，B）{
 回报（a.distance- b.distance）}功能calculateDistances（PT，最接近，numberOfResults）{
  VAR的服务=新使用google.maps.DistanceMatrixService（）;
  VAR请求= {
      来源：[葡文]
      目的地：[]，
      travelMode：google.maps.TravelMode.DRIVING，
      unitSystem来：google.maps.UnitSystem.IMPERIAL，
      avoidHighways：假的，
      avoidTolls：假的
    };
  为（变量I = 0; I＆下; closest.length; i ++在）request.destinations.push（最接近[I] .getPosition（））;
  service.getDistanceMatrix（要求，功能（响应状态）{
    如果（状态！= google.maps.DistanceMatrixStatus.OK）{
      警报（'错误是：+状态）;
    }其他{
      VAR起源= response.originAddresses;
      VAR目的地= response.destinationAddresses;
      变种outputDiv =的document.getElementById（'side_bar'）;
      outputDiv.innerHTML ='';      变种结果= response.rows [0] .elements;
      对于（VAR I = 0; I＆LT; numberOfResults;我++）{
        最接近的[I] .setMap（图）
        outputDiv.innerHTML + =＆LT; A HREF =JavaScript的：google.maps.event.trigger（最接近[+ I +]，\\点击\\）;＆gt;中最接近+ [I] .title伪+' ＆LT; / A＆GT;＆LT; BR＆GT;'最接近+ [I]。地址+＆LT; BR＆gt;中
            +结果[I] .distance.text +'appoximately
            [I] .duration.text + +结果'＆LT; BR＆GT;＆LT;小时＆GT;';
      }
    }
  }）;
}功能getDirections（始发地，目的地）{
  VAR请求= {
      产地：原产地，
      目的地：目的地，
      travelMode：google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route（要求，功能（响应状态）{
    如果（状态== google.maps.DirectionsStatus.OK）{
      directionsDisplay.setMap（地图）;
      directionsDisplay.setDirections（响应）;
      directionsDisplay.setPanel（的document.getElementById（'side_bar'））;
    }
  }）;
}google.maps.event.addDomListener（窗口'负荷'，初始化）;
＆LT; / SCRIPT＆GT;
   ＆LT; /头＆GT;
   ＆LT;身体GT;
＆LT;表边框=1＆GT;＆LT; TR＆GT;＆LT; TD＆GT;
     ＆LT; DIV ID =地图的风格=高度：600像素;宽度：800像素;＆GT;＆LT; / DIV＆GT;
＆LT; / TD＆GT;＆LT; TD＆GT;
     ＆LT; DIV ID =side_bar＆GT;＆LT; / DIV＆GT;
＆LT; / TD＆GT;＆LT; / TR＆GT;＆LT; /表＆gt;
＆LT;输入ID =地址类型=文本VALUE =帕洛阿尔托，加利福尼亚州＆GT;＆LT; /输入＆GT;
＆LT;输入类型=按钮值=搜索的onclick =codeAddress（）;＆GT;＆LT; /输入＆GT;
＆LT; DIV ID =信息＆GT;＆LT; / DIV＆GT;
   ＆LT; /身体GT;
 ＆LT; / HTML＆GT;

解决方案

排序的距离，结果数组。

  results.sort（sortByDistDM）;

其中sortByDistDM是：

 函数sortByDistDM（A，B）{
   回报（a.distance.value- b.distance.value）
}

更新页面

 函数calculateDistances（PT，最接近，numberOfResults）{
  VAR的服务=新使用google.maps.DistanceMatrixService（）;
  VAR请求= {
      来源：[葡文]
      目的地：[]，
      travelMode：google.maps.TravelMode.DRIVING，
      unitSystem来：google.maps.UnitSystem.METRIC，
      avoidHighways：假的，
      avoidTolls：假的
    };
  对于（VAR I = 0; I＆LT; closest.length;我++）{
    request.destinations.push（最接近[I] .getPosition（））;
  }
  service.getDistanceMatrix（要求，功能（响应状态）{
    如果（状态！= google.maps.DistanceMatrixStatus.OK）{
      警报（'错误是：+状态）;
    }其他{
      VAR起源= response.originAddresses;
      VAR目的地= response.destinationAddresses;
      变种outputDiv =的document.getElementById（'side_bar'）;
      outputDiv.innerHTML ='';      变种结果= response.rows [0] .elements;
      //保存标记的名称，地址和索引记录进行排序
      对于（VAR I = 0; I＆LT; closest.length;我++）{
         结果[I] .title伪=最接近的[I] .title伪;
         结果[I]。地址=最接近的[I]。地址;
     结果[I] .idx_closestMark = I;
      }
      results.sort（sortByDistDM）;
      为（变量I = 0;（（I'下; numberOfResults）及及（I＆下; closest.length））;我++）{
        最接近的[I] .setMap（图）
        outputDiv.innerHTML + =＆LT;一href='javascript:google.maps.event.trigger(closest[\"+results[i].idx_closestMark+\"],\\\"click\\\");'>\"+results[i].title +'＆LT; / A＆GT;＆LT; BR＆GT;' +结果[I]。地址+＆LT; BR＆gt;中
            +结果[I] .distance.text +'appoximately
            [I] .duration.text + +结果'＆LT; BR＆GT;＆LT;小时＆GT;';
      }
    }
  }）;
}功能sortByDistDM（A，B）{
   回报（a.distance.value- b.distance.value）
}

code片断：

 VAR地理codeR = NULL;\r
VAR地图= NULL;\r
VAR customerMarker = NULL;\r
变种gmarkers = [];\r
变种最接近= [];\r
\r
函数初始化（）{\r
  //警报（INIT）;\r
  地理codeR =新google.maps.Geo codeR（）;\r
  地图=新google.maps.Map（的document.getElementById（'地图'）{\r
    变焦：9，\r
    中心：新google.maps.LatLng（52.6699927，-0.7274620）\r
    mapTypeId设为：google.maps.MapTypeId.ROADMAP\r
  }）;\r
  VAR信息窗口=新google.maps.InfoWindow（）;\r
  VAR标记，我;\r
  VAR边界=新的google.maps.LatLngBounds（）;\r
  的document.getElementById（信息）的innerHTML =发现+ locations.length +的位置＆LT; BR＆gt;中。\r
  对于（i = 0; I＆LT; locations.length;我++）{\r
    VAR coordStr =位置[I] [4];\r
    变种COORDS = coordStr.split（，）;\r
    VAR PT =新google.maps.LatLng（parseFloat（COORDS [0]），parseFloat（COORDS [1]））;\r
    bounds.extend（PT）;\r
    标记=新google.maps.Marker（{\r
      位置：PT，\r
      地图：地图，\r
      图标：位置由[i] [5]，\r
      地址：位置由[i] [2]，\r
      标题：位置[I] [0]，\r
      HTML：位置[I] [0] +＆LT; BR＆gt;中+位置[I] [2]\r
    }）;\r
    gmarkers.push（标记）;\r
    google.maps.event.addListener（标记，'点击'，（功能（标记，I）{\r
        返回功能（）{\r
          infowindow.setContent（marker.html）;\r
          infowindow.open（地图，标记）;\r
        }\r
      }）\r
      （标记，I））;\r
  }\r
  map.fitBounds（边界）;\r
\r
}\r
\r
功能codeAddress（）{\r
  VAR numberOfResults = 14;\r
  VAR地址=的document.getElementById（'地址'）值。\r
  地理coder.geo code（{\r
    地址：地址\r
  }，功能（结果状态）{\r
    如果（状态== google.maps.Geo coderStatus.OK）{\r
      map.setCenter（结果[0] .geometry.location）;\r
      如果（customerMarker）customerMarker.setMap（NULL）;\r
      customerMarker =新google.maps.Marker（{\r
        地图：地图，\r
        位置：结果[0] .geometry.location\r
      }）;\r
      最接近= findClosestN（结果[0] .geometry.location，numberOfResults）;\r
      //获取行驶距离\r
      最接近= closest.splice（0，numberOfResults）;\r
      calculateDistances（结果[0] .geometry.location，最近，numberOfResults）;\r
    }其他{\r
      警报（'地理code不成功，原因如下：'+状态）;\r
    }\r
  }）;\r
}\r
\r
功能findClosestN（PT，numberOfResults）{\r
  变种最接近= [];\r
  的document.getElementById（信息）的innerHTML + =处理+ gmarkers.length +。＆LT; BR＆gt;中;\r
  对于（VAR I = 0; I＆LT; gmarkers.length;我++）{\r
    gmarkers [I] .distance = google.maps.geometry.spherical.computeDistanceBetween（PT，gmarkers [I] .getPosition（））;\r
    。的document.getElementById（'信息'）的innerHTML + =过程+ I +：+ gmarkers [I] .getPosition（）toUrlValue（6）+：+ gmarkers [I] .distance.toFixed（2- ）+＆LT; BR＆gt;中;\r
    gmarkers [I] .setMap（NULL）;\r
    closest.push（gmarkers [I]）;\r
  }\r
  closest.sort（sortByDist）;\r
  返回最接近;\r
}\r
\r
功能sortByDist（A，B）{\r
  返回（a.distance  -  b.distance）\r
}\r
\r
功能calculateDistances（PT，最接近，numberOfResults）{\r
  VAR的服务=新使用google.maps.DistanceMatrixService（）;\r
  VAR请求= {\r
    来源：[葡文]\r
    目的地：[]，\r
    travelMode：google.maps.TravelMode.DRIVING，\r
    unitSystem来：google.maps.UnitSystem.METRIC，\r
    avoidHighways：假的，\r
    avoidTolls：假的\r
  };\r
  对于（VAR I = 0; I＆LT; closest.length;我++）{\r
    request.destinations.push（最接近[I] .getPosition（））;\r
  }\r
  service.getDistanceMatrix（要求，功能（响应状态）{\r
    如果（状态！= google.maps.DistanceMatrixStatus.OK）{\r
      警报（'错误是：+状态）;\r
    }其他{\r
      VAR起源= response.originAddresses;\r
      VAR目的地= response.destinationAddresses;\r
      变种outputDiv =的document.getElementById（'side_bar'）;\r
      outputDiv.innerHTML ='';\r
\r
      变种结果= response.rows [0] .elements;\r
      //保存标题和地址记录进行排序\r
      对于（VAR I = 0; I＆LT; closest.length;我++）{\r
        结果[I] .title伪=最接近的[I] .title伪;\r
        结果[I]。地址=最接近的[I]。地址;\r
        结果[I] .idx_closestMark = I;\r
      }\r
      results.sort（sortByDistDM）;\r
      为（变量I = 0;\r
        （（ⅰ＆下; numberOfResults）及及（I＆下; closest.length））;我++）{\r
        最接近的[I] .setMap（图）\r
        outputDiv.innerHTML + =＆LT; A HREF =JavaScript的：google.maps.event.trigger（最接近[+结果[I] .idx_closestMark +]，\\点击\\）;＆gt;中+结果[I] .title伪+'＆LT; / A＆GT;＆LT; BR＆GT;' +结果[I]。地址+＆LT; BR＆gt;中+结果[I] .distance.text +'appoximately'+结果[I] .duration.text +'＆LT; BR＆GT;＆LT;小时＆GT;';\r
      }\r
    }\r
  }）;\r
}\r
\r
功能sortByDistDM（A，B）{\r
  返回（a.distance.value  -  b.distance.value）\r
}\r
\r
google.maps.event.addDomListener（窗口'负荷'，初始化）;\r
\r
//商店名称[0]，交货[1]，地址[2]，交货区[3]，坐标[4]从FusionTables比萨饼店示例数据\r
VAR位置= [\r
  [约翰的比萨，无，400大学大道，帕洛阿尔托，加利福尼亚州，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.121277,37.386799,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.118874,37.45224,0 -122.107544,37.437793,0 -122.102737,37.422526,0 -122.113037,37.414618,0 -122.121277,37.386799,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.447038，-122.160575，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [JJS前preSS，是，1000圣克鲁斯大道，门洛帕克，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.200928,37.438611,0  - 122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.144623,37.475948,0 -122.164192,37.481125,0 -122.189255,37.478673,0 -122.208481,37.468319,0 -122.201271,37.438338,0＆LT; /坐标＆GT;＆下; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.448638，-122.187176，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [约翰·保罗的比萨店，无，1100厄尔尼诺的Camino Real，贝尔蒙特，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.304268,37.516534,0 -122.300835,37.505096， 0 -122.262383,37.481669,0 -122.242813,37.502917,0 -122.244186,37.534232,0 -122.269249,37.550021,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0＆LT; /坐标＆GT;＆LT; /线性环与GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.520436，-122.275978，http://maps.google.com/mapfiles/ms/icons/red.png]，\r
  [JJS前preSS，是，300ê第四大道，圣马刁，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.304268,37.516534,0  - 122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.281609,37.570433,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0＆LT; /坐标＆GT;＆下; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.564435，-122.322080，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [约翰的比萨，是，1400年的百老汇大街，伯林格姆，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.374306,37.548933,0 -122.348557,37.538044,0  - 122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.359543,37.59764,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.374306,37.548933,0＆LT; /坐标＆GT;＆LT; /线性环＆GT ;＆所述; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.584935，-122.366182，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [JJS前preSS，是，700圣布鲁诺大街，圣布鲁诺，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.462883,37.628916,0  - 122.445374,37.639247,0 -122.426147,37.648762,0 -122.405205,37.642238,0 -122.400055,37.628644,0 -122.392159,37.610696,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.462196,37.628644,0＆LT; /坐标＆GT;＆下; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.630934，-122.406883，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [JJS前preSS，是，300滩街，旧金山，加州，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.43576,37.790795,0 -122.449493 ，37.801646,0 -122.425461,37.809784,0 -122.402115,37.811411,0 -122.390442,37.794593,0 -122.408295,37.79188,0 -122.434387,37.789167,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆LT; / outerBoundaryIs＆GT;＆LT ; /多边形＆gt;中，37.807628，-122.413782，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [JJS前preSS，是，1400海特街，旧金山，加州，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.463398,37.760266,0 -122.477349 ，37.774785,0 -122.427349,37.774785,0 -122.429237,37.763658,0 -122.46357,37.760808,0</coordinates></LinearRing></outerBoundaryIs></Polygon>\", 37.770129，-122.445082，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [JJS前preSS，是，2400团街，旧金山，加州，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.418766,37.747779,0 -122.425289 ，37.768951,0 -122.406063,37.769901,0 -122.406063,37.749679,0 -122.418251,37.747508,0＆下; /坐标＆GT;＆下; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.758630，-122.419082 http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [JJS前preSS，是，500卡斯特罗街，加州山景城，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.121277,37.386799,0 -122.108917 ，37.362244,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.069778,37.3898,0 -122.076645,37.402619,0 -122.078705,37.411619,0 -122.113037,37.414618,0 -122.121277,37.386799,0＆LT; /坐标＆GT ;＆所述; /线性环＆GT;＆下; / outerBoundaryIs＆GT;＆下; /多边形＆gt;中，37.390040，-122.081573，http://maps.google.com/mapfiles/ms/icons/green.png]，\r
  [约翰的比萨，无，100秒墨菲大道，桑尼维尔，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.047119,37.33113,0 -122.065315,37.332495,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.036819,37.385162,0 -122.006607,37.382162,0 -122.00386,37.342048,0 -122.047119,37.331403,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆LT; / outerBoundaryIs＆GT ;＆所述; /多边形＆gt;中，37.377441，-122.030071，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [约翰的比萨，无，1200 Curtner大道，加利福尼亚州圣何塞市，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -121.935196,37.345051,0 -121.931076,37.294267,0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.798553,37.361426,0 -121.879578,37.36088,0 -121.934509,37.345597,0 -121.935196,37.345051,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆LT; / outerBoundaryIs＆GT ;＆所述; /多边形＆gt;中，37.288742，-121.890765，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [约翰的比萨，是，700花山道，加利福尼亚州圣何塞市，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -121.935883,37.253287,0 -121.931076,37.294267， 0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.790657,37.234702,0 -121.852455,37.223221,0 -121.935539,37.253014,0＆LT; /坐标＆GT;＆LT; /线性环＆GT;＆LT; / outerBoundaryIs＆GT;＆LT; /多边形＆GT ;，37.250543，-121.846563，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [约翰的比萨，是，100牛顿米尔皮塔斯大道，加利福尼亚州米尔皮塔斯，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -121.947556,37.435612,0 -121.934509,37.476493,0 -121.893311,37.469409,0 -121.852798,37.429615,0 -121.843872,37.400165,0 -121.887817,37.3898,0 -121.959915,37.420345,0 -121.959915,37.427979,0 -121.948929,37.435612,0 -121.947556,37.435612,0</coordinates></LinearRing></outerBoundaryIs></Polygon>\", 37.434113，-121.901139，http://maps.google.com/mapfiles/ms/icons/blue.png]，\r
  [约翰的比萨，是，3300莫里大道，弗里蒙特，CA，＆LT;多边形＆GT;＆LT; outerBoundaryIs＆GT;＆LT;线性环＆GT;＆LT;坐标＆GT; -122.02343,37.52198,0 -122.023773,37.558731,0  - 121.989784,37.573426,0 -121.959572,37.566351,0 -121.944466,37.544305,0 -121.967125,37.520891,0 -122.023087,37.522525,0</coordinates></LinearRing></outerBoundaryIs></Polygon>\", 37.552773，-121.985153，http://maps.google.com/mapfiles/ms/icons/blue.png]\r
];

 HTML，\r
身体，\r
#map_canvas {\r
  保证金：0;\r
  填充：0;\r
  高度：100％;\r
}

＆LT;脚本SRC =https://maps.googleapis.com/maps / API / JS库=几何＆GT;＆LT; / SCRIPT＆GT;\r
＆LT;表边框=1＆GT;\r
  ＆所述; TR＆GT;\r
    ＆LT; TD VALIGN =顶＆GT;\r
      ＆LT; DIV ID =地图的风格=高度：600像素;宽度：800像素;＆GT;＆LT; / DIV＆GT;\r
    ＆LT; / TD＆GT;\r
    ＆所述; TD＆GT;\r
      ＆LT; DIV ID =side_bar＆GT;＆LT; / DIV＆GT;\r
    ＆LT; / TD＆GT;\r
  ＆LT; / TR＆GT;\r
＆LT; /表＆gt;\r
＆LT;输入ID =地址类型=文本VALUE =帕洛阿尔托，加利福尼亚州/＆GT;\r
＆LT;输入类型=按钮值=搜索的onclick =codeAddress（）; /＆GT;\r
＆LT; DIV ID =信息＆GT;＆LT; / DIV＆GT;

I have a number of employees in various locations. When I receive a job, I want to assign it to the nearest employee. So in this case, the assignment is in zip code 06810. The current code below first ranks the straight line distance using Latitude and Longitude. Then using google directions, the actual driving distance in miles is calculated but is still sorted by straight line distance. I would like the results sorted by actual driving distance like in the second group. Anyone know how to do this? Thanks

Original Results - http://vince.netau.net/vince.html    Using Zip Code 06810
Jen Alexander process 3:41.159977,-73.982356:      50348.52      54.3 Miles
Richard Henderson process 11:40.858696,-73.297249: 59009.38        92 Miles
Jim Thomas process 0:41.041599,-74.019554:         60252.91      55.5 Miles
Don James process 2:40.997704,-74.050598:          65365.08      59.5 Miles
John Smith process 1:40.986584,-74.290207:         82405.22        74 Miles
Al Bundy process 8:40.804319,-74.122668:           84834.76      71.2 Miles
Tim Hager process 7:40.691845,-73.969104:          87569.35      69.9 Miles
Ken Roberts process 5:40.754302,-74.409713:       105950.12      92.8 Miles
Vince Patera process 9:40.562019,-74.452335:      123497.86       101 Miles
Thomas Glenn process 10:40.291759,-74.343231:     142031.60       109 Miles
Tom Jones process 4:40.001475,-75.0268:           202567.94       153 Miles
Kevin James process 6:39.82534,-74.919937:        212467.19       155 Miles

Results I want
Jen Alexander process 3:41.159977,-73.982356:      50348.52      54.3 Miles
Jim Thomas process 0:41.041599,-74.019554:         60252.91      55.5 Miles
Don James process 2:40.997704,-74.050598:          65365.08      59.5 Miles
Tim Hager process 7:40.691845,-73.969104:          87569.35      69.9 Miles
Al Bundy process 8:40.804319,-74.122668:           84834.76      71.2 Miles
John Smith process 1:40.986584,-74.290207:         82405.22        74 Miles  
Richard Henderson process 11:40.858696,-73.297249: 59009.38        92 Miles
Ken Roberts process 5:40.754302,-74.409713:       105950.12      92.8 Miles
Vince Patera process 9:40.562019,-74.452335:      123497.86       101 Miles
Thomas Glenn process 10:40.291759,-74.343231:     142031.60       109 Miles
Tom Jones process 4:40.001475,-75.0268:           202567.94       153 Miles
Kevin James process 6:39.82534,-74.919937:        212467.19       155 Miles

code:

<!DOCTYPE html>
 <html>
   <head>
     <title>Google Maps JavaScript API v3 Example: Map Simple</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
     <meta charset="utf-8">
     <style>
       html, body, #map_canvas {
         margin: 0;
         padding: 0;
         height: 100%;
       }
     </style>
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false"></script>
<script type="text/javascript">     
// Store Name[0],delivery[1],Address[2],Delivery Zone[3],Coordinates[4] data from FusionTables pizza stores example
var locations = [
["Jim Thomas","no","12 Williams Rd, Montvale, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.118874,37.45224,0 -122.107544,37.437793,0 -122.102737,37.422526,0 -122.113037,37.414618,0 -122.121277,37.386799,0   </coordinates></LinearRing></outerBoundaryIs></Polygon>","41.041599,-74.019554","http://maps.google.com/mapfiles/ms/icons/blue.png"],
["John Smith","yes","8 Craig Place, Pompton Lakes, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.200928,37.438611,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.144623,37.475948,0 -122.164192,37.481125,0 -122.189255,37.478673,0 -122.208481,37.468319,0 -122.201271,37.438338,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.986584,-74.290207","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Don James","no","689 Fern St, Township of Washington, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.300835,37.505096,0 -122.262383,37.481669,0 -122.242813,37.502917,0 -122.244186,37.534232,0 -122.269249,37.550021,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.997704,-74.050598","http://maps.google.com/mapfiles/ms/icons/red.png"],
["Jen Alexander","yes","45 Heritage Dr, New City, NY","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.281609,37.570433,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","41.159977,-73.982356","http://maps.google.com/mapfiles/ms/icons/yellow.png"],
["Tom Jones","yes","263 W. Broad St, Palmyra, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.374306,37.548933,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.359543,37.59764,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.374306,37.548933,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.001475, -75.026800","http://maps.google.com/mapfiles/ms/icons/blue.png"],
["Ken Roberts","yes","169 Main St, Madison, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.462883,37.628916,0 -122.445374,37.639247,0 -122.426147,37.648762,0 -122.405205,37.642238,0 -122.400055,37.628644,0 -122.392159,37.610696,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.462196,37.628644,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.754302, -74.409713","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Kevin James","yes","90 Tenby Chase Dr, Voorhees, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.43576,37.790795,0 -122.449493,37.801646,0 -122.425461,37.809784,0 -122.402115,37.811411,0 -122.390442,37.794593,0 -122.408295,37.79188,0 -122.434387,37.789167,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","39.825340, -74.919937","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Tim Hager","yes","208 Clinton Ave, Brooklyn, NY","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.463398,37.760266,0 -122.477349,37.774785,0 -122.427349,37.774785,0 -122.429237,37.763658,0 -122.46357,37.760808,0</coordinates></LinearRing></outerBoundaryIs></Polygon>","40.691845, -73.969104","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Al Bundy","yes","554 Page Ave, Lyndhurst, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.418766,37.747779,0 -122.425289,37.768951,0 -122.406063,37.769901,0 -122.406063,37.749679,0 -122.418251,37.747508,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.804319, -74.122668","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Vince Patera","yes","12 Marissa Ct, Piscataway, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.108917,37.362244,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.069778,37.3898,0 -122.076645,37.402619,0 -122.078705,37.411619,0 -122.113037,37.414618,0 -122.121277,37.386799,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.562019, -74.452335","http://maps.google.com/mapfiles/ms/icons/green.png"],
["Thomas Glenn","no","8 Taylors Mills Rd, Manalapan, NJ","<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.047119,37.33113,0 -122.065315,37.332495,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.036819,37.385162,0 -122.006607,37.382162,0 -122.00386,37.342048,0 -122.047119,37.331403,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.291759, -74.343231","http://maps.google.com/mapfiles/ms/icons/blue.png"],
["Richard Henderson","no","27 Buhl Ln, East Northport, NY","<Polygon><outerBoundaryIs><LinearRing><coordinates>-121.935196,37.345051,0 -121.931076,37.294267,0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.798553,37.361426,0 -121.879578,37.36088,0 -121.934509,37.345597,0 -121.935196,37.345051,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>","40.858696, -73.297249","http://maps.google.com/mapfiles/ms/icons/yellow.png"],
];
// alert(locations.length);

var geocoder = null;
var map = null;
var customerMarker = null;
var gmarkers = [];
var closest = [];
var directionsDisplay = new google.maps.DirectionsRenderer();;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
// alert("init");
  geocoder = new google.maps.Geocoder();
  map = new google.maps.Map(document.getElementById('map'), 
        {       
            zoom: 9,       
            center: new google.maps.LatLng(52.6699927, -0.7274620),       
            mapTypeId: google.maps.MapTypeId.ROADMAP     
        });      
  var infowindow = new google.maps.InfoWindow();      
  var marker, i;      
  var bounds = new google.maps.LatLngBounds();
  document.getElementById('info').innerHTML = "found "+locations.length+" locations<br>";
  for (i = 0; i < locations.length; i++) {         
            var coordStr = locations[i][4];
        var coords = coordStr.split(",");
        var pt = new google.maps.LatLng(parseFloat(coords[0]),parseFloat(coords[1]));
            bounds.extend(pt);
            marker = new google.maps.Marker({         
                            position: pt,         
                            map: map,
                icon: locations[i][5],
                            address: locations[i][2],
                            title: locations[i][0],
                            html: locations[i][0]+"<br>"+locations[i][2]+"<br><br><a href='javascript:getDirections(customerMarker.getPosition(),&quot;"+locations[i][2]+"&quot;);'>Get Directions</a>"
                            });                              
            gmarkers.push(marker);
            google.maps.event.addListener(marker, 'click', (function(marker, i) {         return function() 
            {           infowindow.setContent(marker.html);
                        infowindow.open(map, marker);         
            }       
        })
        (marker, i));     
    }
    map.fitBounds(bounds);   

}

      function codeAddress() {
        var address = document.getElementById('address').value;
        geocoder.geocode( { 'address': address}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
        if (customerMarker) customerMarker.setMap(null);
            customerMarker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });
        closest = findClosestN(results[0].geometry.location,12);
            // get driving distance
            closest = closest.splice(0,12);
            calculateDistances(results[0].geometry.location, closest,12);
          } else {
            alert('Geocode was not successful for the following reason: ' + status);
          }
        });
      }

function findClosestN(pt,numberOfResults) {
   var closest = [];
   document.getElementById('info').innerHTML += "processing "+gmarkers.length+"<br>";
   for (var i=0; i<gmarkers.length;i++) {
     gmarkers[i].distance = google.maps.geometry.spherical.computeDistanceBetween(pt,gmarkers[i].getPosition());
     document.getElementById('info').innerHTML += "process "+i+":"+gmarkers[i].getPosition().toUrlValue(6)+":"+gmarkers[i].distance.toFixed(2)+"<br>";
     gmarkers[i].setMap(null);
     closest.push(gmarkers[i]);
     closest.sort(sortByDist);  
   }

   return closest;
}

function sortByDist(a,b) { 
 return (a.distance- b.distance)

}

function calculateDistances(pt,closest,numberOfResults) {
  var service = new google.maps.DistanceMatrixService();
  var request =    {
      origins: [pt],
      destinations: [],
      travelMode: google.maps.TravelMode.DRIVING,
      unitSystem: google.maps.UnitSystem.IMPERIAL,
      avoidHighways: false,
      avoidTolls: false
    };
  for (var i=0; i<closest.length; i++) request.destinations.push(closest[i].getPosition());
  service.getDistanceMatrix(request, function (response, status) {
    if (status != google.maps.DistanceMatrixStatus.OK) {
      alert('Error was: ' + status);
    } else {
      var origins = response.originAddresses;
      var destinations = response.destinationAddresses;
      var outputDiv = document.getElementById('side_bar');
      outputDiv.innerHTML = '';

      var results = response.rows[0].elements;
      for (var i = 0; i < numberOfResults; i++) {
        closest[i].setMap(map);
        outputDiv.innerHTML += "<a href='javascript:google.maps.event.trigger(closest["+i+"],\"click\");'>"+closest[i].title + '</a><br>' + closest[i].address+"<br>"
            + results[i].distance.text + ' appoximately '
            + results[i].duration.text + '<br><hr>';
      }
    }
  });
}

function getDirections(origin, destination) {
  var request = {
      origin:origin,
      destination:destination,
      travelMode: google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setMap(map);
      directionsDisplay.setDirections(response);
      directionsDisplay.setPanel(document.getElementById('side_bar'));
    }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script> 
   </head>
   <body>
<table border="1"><tr><td>
     <div id="map" style="height: 600px; width:800px;"></div>
</td><td>
     <div id="side_bar"></div>
</td></tr></table>
<input id="address" type="text" value="Palo Alto, CA"></input>
<input type="button" value="Search" onclick="codeAddress();"></input>
<div id="info"></div>
   </body>
 </html>

解决方案

Sort the results array by the distance.

 results.sort(sortByDistDM);

where sortByDistDM is:

function sortByDistDM(a,b) {
   return (a.distance.value- b.distance.value)
}

updated page

function calculateDistances(pt,closest,numberOfResults) {
  var service = new google.maps.DistanceMatrixService();
  var request =    {
      origins: [pt],
      destinations: [],
      travelMode: google.maps.TravelMode.DRIVING,
      unitSystem: google.maps.UnitSystem.METRIC,
      avoidHighways: false,
      avoidTolls: false
    };
  for (var i=0; i<closest.length; i++) {
    request.destinations.push(closest[i].getPosition());
  }
  service.getDistanceMatrix(request, function (response, status) {
    if (status != google.maps.DistanceMatrixStatus.OK) {
      alert('Error was: ' + status);
    } else {
      var origins = response.originAddresses;
      var destinations = response.destinationAddresses;
      var outputDiv = document.getElementById('side_bar');
      outputDiv.innerHTML = '';

      var results = response.rows[0].elements;
      // save title, address and index of marker in record for sorting
      for (var i=0; i<closest.length;i++) {
         results[i].title = closest[i].title;
         results[i].address = closest[i].address;
     results[i].idx_closestMark = i;
      }
      results.sort(sortByDistDM);
      for (var i = 0; ((i < numberOfResults) && (i < closest.length)); i++) {
        closest[i].setMap(map);
        outputDiv.innerHTML += "<a href='javascript:google.maps.event.trigger(closest["+results[i].idx_closestMark+"],\"click\");'>"+results[i].title + '</a><br>' + results[i].address+"<br>"
            + results[i].distance.text + ' appoximately '
            + results[i].duration.text + '<br><hr>';
      }
    }
  });
}

function sortByDistDM(a,b) {
   return (a.distance.value- b.distance.value)
}

code snippet:

var geocoder = null;
var map = null;
var customerMarker = null;
var gmarkers = [];
var closest = [];

function initialize() {
  // alert("init");
  geocoder = new google.maps.Geocoder();
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 9,
    center: new google.maps.LatLng(52.6699927, -0.7274620),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var infowindow = new google.maps.InfoWindow();
  var marker, i;
  var bounds = new google.maps.LatLngBounds();
  document.getElementById('info').innerHTML = "found " + locations.length + " locations<br>";
  for (i = 0; i < locations.length; i++) {
    var coordStr = locations[i][4];
    var coords = coordStr.split(",");
    var pt = new google.maps.LatLng(parseFloat(coords[0]), parseFloat(coords[1]));
    bounds.extend(pt);
    marker = new google.maps.Marker({
      position: pt,
      map: map,
      icon: locations[i][5],
      address: locations[i][2],
      title: locations[i][0],
      html: locations[i][0] + "<br>" + locations[i][2]
    });
    gmarkers.push(marker);
    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(marker.html);
          infowindow.open(map, marker);
        }
      })
      (marker, i));
  }
  map.fitBounds(bounds);

}

function codeAddress() {
  var numberOfResults = 14;
  var address = document.getElementById('address').value;
  geocoder.geocode({
    'address': address
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
      if (customerMarker) customerMarker.setMap(null);
      customerMarker = new google.maps.Marker({
        map: map,
        position: results[0].geometry.location
      });
      closest = findClosestN(results[0].geometry.location, numberOfResults);
      // get driving distance
      closest = closest.splice(0, numberOfResults);
      calculateDistances(results[0].geometry.location, closest, numberOfResults);
    } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
}

function findClosestN(pt, numberOfResults) {
  var closest = [];
  document.getElementById('info').innerHTML += "processing " + gmarkers.length + "<br>";
  for (var i = 0; i < gmarkers.length; i++) {
    gmarkers[i].distance = google.maps.geometry.spherical.computeDistanceBetween(pt, gmarkers[i].getPosition());
    document.getElementById('info').innerHTML += "process " + i + ":" + gmarkers[i].getPosition().toUrlValue(6) + ":" + gmarkers[i].distance.toFixed(2) + "<br>";
    gmarkers[i].setMap(null);
    closest.push(gmarkers[i]);
  }
  closest.sort(sortByDist);
  return closest;
}

function sortByDist(a, b) {
  return (a.distance - b.distance)
}

function calculateDistances(pt, closest, numberOfResults) {
  var service = new google.maps.DistanceMatrixService();
  var request = {
    origins: [pt],
    destinations: [],
    travelMode: google.maps.TravelMode.DRIVING,
    unitSystem: google.maps.UnitSystem.METRIC,
    avoidHighways: false,
    avoidTolls: false
  };
  for (var i = 0; i < closest.length; i++) {
    request.destinations.push(closest[i].getPosition());
  }
  service.getDistanceMatrix(request, function(response, status) {
    if (status != google.maps.DistanceMatrixStatus.OK) {
      alert('Error was: ' + status);
    } else {
      var origins = response.originAddresses;
      var destinations = response.destinationAddresses;
      var outputDiv = document.getElementById('side_bar');
      outputDiv.innerHTML = '';

      var results = response.rows[0].elements;
      // save title and address in record for sorting
      for (var i = 0; i < closest.length; i++) {
        results[i].title = closest[i].title;
        results[i].address = closest[i].address;
        results[i].idx_closestMark = i;
      }
      results.sort(sortByDistDM);
      for (var i = 0;
        ((i < numberOfResults) && (i < closest.length)); i++) {
        closest[i].setMap(map);
        outputDiv.innerHTML += "<a href='javascript:google.maps.event.trigger(closest[" + results[i].idx_closestMark + "],\"click\");'>" + results[i].title + '</a><br>' + results[i].address + "<br>" + results[i].distance.text + ' appoximately ' + results[i].duration.text + '<br><hr>';
      }
    }
  });
}

function sortByDistDM(a, b) {
  return (a.distance.value - b.distance.value)
}

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

// Store Name[0],delivery[1],Address[2],Delivery Zone[3],Coordinates[4] data from FusionTables pizza stores example
var locations = [
  ["John's Pizza", "no", "400 University Ave, Palo Alto, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.118874,37.45224,0 -122.107544,37.437793,0 -122.102737,37.422526,0 -122.113037,37.414618,0 -122.121277,37.386799,0   </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.447038,-122.160575", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["JJs Express", "yes", "1000 Santa Cruz Ave, Menlo Park, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.200928,37.438611,0 -122.158012,37.4168,0 -122.158012,37.448151,0 -122.142906,37.456055,0 -122.144623,37.475948,0 -122.164192,37.481125,0 -122.189255,37.478673,0 -122.208481,37.468319,0 -122.201271,37.438338,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.448638,-122.187176", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["John Paul's Pizzeria", "no", "1100 El Camino Real, Belmont, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.300835,37.505096,0 -122.262383,37.481669,0 -122.242813,37.502917,0 -122.244186,37.534232,0 -122.269249,37.550021,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.520436,-122.275978", "http://maps.google.com/mapfiles/ms/icons/red.png"],
  ["JJs Express", "yes", "300 E 4th Ave, San Mateo, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.304268,37.516534,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.281609,37.570433,0 -122.291222,37.545122,0 -122.302895,37.537499,0 -122.304268,37.516534,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.564435,-122.322080", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["John's Pizza", "yes", "1400 Broadway Ave, Burlingame, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.374306,37.548933,0 -122.348557,37.538044,0 -122.359886,37.56363,0 -122.364006,37.582405,0 -122.33654,37.589207,0 -122.359543,37.59764,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.374306,37.548933,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.584935,-122.366182", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["JJs Express", "yes", "700 San Bruno Ave, San Bruno, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.462883,37.628916,0 -122.445374,37.639247,0 -122.426147,37.648762,0 -122.405205,37.642238,0 -122.400055,37.628644,0 -122.392159,37.610696,0 -122.372246,37.604712,0 -122.417564,37.594648,0 -122.462196,37.628644,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.630934,-122.406883", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["JJs Express", "yes", "300 Beach St, San Francisco, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.43576,37.790795,0 -122.449493,37.801646,0 -122.425461,37.809784,0 -122.402115,37.811411,0 -122.390442,37.794593,0 -122.408295,37.79188,0 -122.434387,37.789167,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.807628,-122.413782", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["JJs Express", "yes", "1400 Haight St, San Francisco, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.463398,37.760266,0 -122.477349,37.774785,0 -122.427349,37.774785,0 -122.429237,37.763658,0 -122.46357,37.760808,0</coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.770129,-122.445082", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["JJs Express", "yes", "2400 Mission St, San Francisco, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.418766,37.747779,0 -122.425289,37.768951,0 -122.406063,37.769901,0 -122.406063,37.749679,0 -122.418251,37.747508,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.758630,-122.419082", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["JJs Express", "yes", "500 Castro St, Mountain View, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.121277,37.386799,0 -122.108917,37.362244,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.069778,37.3898,0 -122.076645,37.402619,0 -122.078705,37.411619,0 -122.113037,37.414618,0 -122.121277,37.386799,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.390040,-122.081573", "http://maps.google.com/mapfiles/ms/icons/green.png"],
  ["John's Pizza", "no", "100 S Murphy Ave, Sunnyvale, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.047119,37.33113,0 -122.065315,37.332495,0 -122.077675,37.3385,0 -122.064285,37.378615,0 -122.036819,37.385162,0 -122.006607,37.382162,0 -122.00386,37.342048,0 -122.047119,37.331403,0  </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.377441,-122.030071", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["John's Pizza", "no", "1200 Curtner Ave, San Jose, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-121.935196,37.345051,0 -121.931076,37.294267,0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.798553,37.361426,0 -121.879578,37.36088,0 -121.934509,37.345597,0 -121.935196,37.345051,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.288742,-121.890765", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["John's Pizza", "yes", "700 Blossom Hill Rd, San Jose, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-121.935883,37.253287,0 -121.931076,37.294267,0 -121.871338,37.293721,0 -121.806793,37.293174,0 -121.790657,37.234702,0 -121.852455,37.223221,0 -121.935539,37.253014,0 </coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.250543,-121.846563", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["John's Pizza", "yes", "100 N Milpitas Blvd, Milpitas, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-121.947556,37.435612,0 -121.934509,37.476493,0 -121.893311,37.469409,0 -121.852798,37.429615,0 -121.843872,37.400165,0 -121.887817,37.3898,0 -121.959915,37.420345,0 -121.959915,37.427979,0 -121.948929,37.435612,0 -121.947556,37.435612,0</coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.434113,-121.901139", "http://maps.google.com/mapfiles/ms/icons/blue.png"],
  ["John's Pizza", "yes", "3300 Mowry Blvd, Fremont, CA", "<Polygon><outerBoundaryIs><LinearRing><coordinates>-122.02343,37.52198,0 -122.023773,37.558731,0 -121.989784,37.573426,0 -121.959572,37.566351,0 -121.944466,37.544305,0 -121.967125,37.520891,0 -122.023087,37.522525,0</coordinates></LinearRing></outerBoundaryIs></Polygon>", "37.552773,-121.985153", "http://maps.google.com/mapfiles/ms/icons/blue.png"]
];

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

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<table border="1">
  <tr>
    <td valign="top">
      <div id="map" style="height: 600px; width:800px;"></div>
    </td>
    <td>
      <div id="side_bar"></div>
    </td>
  </tr>
</table>
<input id="address" type="text" value="Palo Alto, CA" />
<input type="button" value="Search" onclick="codeAddress();" />
<div id="info"></div>

这篇关于谷歌地图API - 最近点 - 更改排序顺序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

谷歌地图API - 最近点 - 更改排序顺序 [英] Google Maps API - Closest points - Changing the sort order

问题描述

相关文章

前端开发最新文章

热门教程

热门工具

登录关闭

谷歌地图API - 最近点 - 更改排序顺序 [英] Google Maps API - Closest points - Changing the sort order

问题描述

相关文章

前端开发最新文章

热门教程

热门工具

登录 关闭

登录关闭