毕设系列之使用百度地图api实现两地之间的路径查询

这个其实是我看到了百度地图API中官方手册后，慢慢摸索的代码，也就是说东凑西凑的代码。

注意，我使用的是ASP.NET,但是客户端一部分实际上还是js。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Transport1.aspx.cs" Inherits="WebApplication3.Transport.Transport1" %>






  
  
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=你的百度API密钥" >
</script>



    

       
  
        要查询的地址：
        查询结果(经度):
        查询结果(纬度):
        查询结果(时间):
        查询结果(路程):
        
           
           

        
    

<script type="text/javascript">
    var map = new BMapGL.Map("container");//在container中新建一个地图
    map.enableScrollWheelZoom();    //启用滚轮放大缩小，默认禁用
    var myGeo = new BMapGL.Geocoder();
    var localSearch = new BMapGL.LocalSearch(map);
    localSearch.enableAutoViewport();
    map.addEventListener('click', function (e) {//点击标记开始读取地点经纬度，这是因为百度地图的api我最开始仅仅找到了根据经纬度查询的方法
        document.getElementById("result_").value = e.latlng.lng;
        document.getElementById("result_1").value = e.latlng.lat;
    });
    function searchByStationName() {//进行输入地点的查询
        var keyword = document.getElementById("text_").value;
        myGeo.getPoint(keyword, function (point) {
            if (point) {
                map.centerAndZoom(point, 16);//这是我们输入的地址，后面16是地图打开的样式，这个16是可以更改的
                map.addOverlay(new BMapGL.Marker(point, { title: keyword }))//在找到的点处做好标记
            } else {
                alert('您选择的地址没有解析到结果！');
            }
        }, '中国')
    }

    function searchRoute() {
        var output1 = "";
        var output2 = "";
        var searchComplete = function (results) {
            if (transit.getStatus() != BMAP_STATUS_SUCCESS) {
                return;
            }
            var plan = results.getPlan(0);
            output1 += "总时间为：";
            output1 += plan.getDuration(true) + "\n";                //获取时间
            output2 += "总路程为：";
            output2 += plan.getDistance(true) + "\n";             //获取距离
        }
        var transit = new BMapGL.DrivingRoute(map, {
            renderOptions: { map: map },
            onSearchComplete: searchComplete,
            onPolylinesSet: function () {
            setTimeout(function () { document.getElementById("time_").value = output1, document.getElementById("road_").value = output2 }, "1000");
            }
        });
        var start = new BMapGL.Point(119.876341, 18.749703);//这里输入起点的经纬度，这两个值都可以变
        var end = new BMapGL.Point(document.getElementById("result_").value, document.getElementById("result_1").value);
        transit.search(start, end);
    }
</script> 

 输出结果