初学google map（二）

最新推荐文章于 2024-10-18 17:51:23 发布

longlongmylove

最新推荐文章于 2024-10-18 17:51:23 发布

阅读量1.1k

点赞数

分类专栏： google map 文章标签： google distance border div javascript api

本文链接：https://blog.csdn.net/longlongmylove/article/details/4633604

版权

google map 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

行车路线
可以用GDirections对象来计算行车路线。详细信息查看API文档。
在调试过程中可以查看directions对象的请求状态。计算路径可以用load和loadFromWaypoints方法

来查询，如果参数为多个坐标，则用数组来存放，另外可以根据GDirectionsOptions的参数来来设置

标记是否拖动等其他属性。
<html>
<head>
    <title>Google Maps JavaScript API Example: Simple Directions</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAA9rPHPzW1TH1vr2ejmjcezxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxS10E4LTpyI96dJmlDoOiCIW9u_kA"
      type="text/javascript"></script>
    <script type="text/javascript">
// Create a directions object and register a map and DIV to hold the
    // resulting computed directions

    var map;
    var directionsPanel;
    var directions;

    function initialize() {
    if (GBrowserIsCompatible()) {
      map = new GMap2(document.getElementById("maps"));
//杭州中心经纬坐标。14为缩放级别
      map.setCenter(new GLatLng(30.320, 120.154), 14);
//设置鼠标滑轮缩放开启
      map.enableScrollWheelZoom();
      directionsPanel = document.getElementById("route");
     directions = new GDirections(map, directionsPanel);

//多个坐标用数组存放，另外坐标前需加上new GLatLng
directions.loadFromWaypoints([new GLatLng(30.323915428873455,

120.14554023742676),new GLatLng(30.313246211525392, 120.13223648071289),new GLatLng

(30.268111470509464, 120.1658821105957)]);
//检查请求状态来判断查询结果。
     //alert("请求状态："+directions.getStatus());
//获得路线的距离。
      // document.getElementById("distance").innerHTML=directions.getDistance().meters;
      // var polylines=directions.getPolyline();
}
}
    </script>
</head>
<body οnlοad="initialize()" οnunlοad="GUnload()">
    <div id="maps" style="width: 70%; height: 480px; float:left; border: 1px solid

black;"></div>
<div id="route" style="width: 25%; height:480px; float:right; border; 1px solid

black;"></div>
    <br/>
    <div id="distance" />
    <br/>
</body>
</html>
另外其他方法详见API文档。http://code.google.com/intl/zh-CN/apis/maps/documentation/reference.html#GDirections