百度地图API开发:map.getDistance计算两点之间的距离(直线距离)

getDistance(start: Point, end: Point),返回两点之间的距离,单位是米

创建容器

<div id="container"></div>

JS代码

    //异步加载地图
    function loadJScript() {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'http://api.map.baidu.com/api?v=2.0&ak=&ak=11Z8uiP8kIz6AG0Vjiwzbc5f**&callback=init';
        document.body.appendChild(script);
    }

    window.onload = loadJScript; // 异步加载地图

    //执行地图;
    function init() {
        var map = new BMap.Map('container'); // 创建Map实例
        var point = new BMap.Point(116.404, 39.915); // 创建点坐标
        map.centerAndZoom(point, 10);
        map.enableScrollWheelZoom(); // 启用滚轮放大缩小

        var myP1 = new BMap.Point(116.380967, 39.913285);    //起点
        var myP2 = new BMap.Point(116.424374, 39.914668);    //终点

        console.log('两点之间的距离:' + (map.getDistance(myP1, myP2)).toFixed(2) + '米');
    }

封装函数版

 //计算两点的距离;
        var p1 = [116.380967, 39.913285];
        var p2 = [116.424374, 39.914668];
        calMeter(p1, p2);

        //封装计算两点之间的距离;
        function calMeter(p1, p2) {
            var myP1 = new BMap.Point(p1[0], p1[1]);    //起点
            var myP2 = new BMap.Point(p2[0], p2[1]);    //终点
            console.log('两点之间的距离:' + (map.getDistance(myP1, myP2)).toFixed(2) + '米');
        }

Done !

在高德地图 API 中,获取两点之间直线距离可以通过 `AMap.Geolocation` 和 `AMap.Polyline` 组件结合来实现。以下是一个简单的步骤: 1. **引入依赖库**:首先确保已导入高德地图相关的 JavaScript 库和模块。 ```javascript import AMap from 'amap-js-sdk'; ``` 2. **初始化地图实例**:在需要的地方创建地图实例。 ```javascript const map = new AMap.Map('container', { zoom: 10, // 地图初始缩放级别 center: [116.39, 39.9], // 北京的中心坐标 }); ``` 3. **获取地理编码服务**:用于将地址转换为经纬度。 ```javascript const geocoder = new AMap.Geocoder(); ``` 4. **查询起点和终点的经纬度**:根据实际需求,用户输入或从数据库获取地址,调用 `geocode()` 方法。 ```javascript function getDistance(startAddress, endAddress) { return new Promise((resolve, reject) => { geocoder.getAddress(startAddress, (status, result) => { if (status === 'complete' && result.info === 'OK') { const startPoint = result.formatted_addresses; geocoder.getAddress(endAddress, (status, result) => { if (status === 'complete' && result.info === 'OK') { const endPoint = result.formatted_addresses; // 获取经纬度数组 const startCoord = result.poi ? result.poi.location : result.addressComponent.lnglat; const endCoord = result.poi ? result.poi.location : result.addressComponent.lnglat; // 计算距离 calculateLineDistance(startCoord, endCoord).then(distance => { resolve(distance); }); } else { reject(result.message); } }); } else { reject(result.message); } }); }); } // 自定义方法计算两点间的直线距离 function calculateLineDistance(startCoord, endCoord) { const startLat = startCoord.lat, startLng = startCoord.lng, endLat = endCoord.lat, endLng = endCoord.lng; const distanceService = new AMap.DistanceMatrix(); distanceService.calculate([ { location: startLat + ',' + startLng }, { location: endLat + ',' + endLng } ]).then(response => { const result = response.result; return result.distance.toFixed(2); // 返回千米为单位的距离 }).catch(err => console.error(err)); } ``` 5. **调用距离计算**:当你需要知道两点之间距离时,传入地址并处理返回结果。 ```javascript getDistance('起点地址', '终点地址') .then(distance => { console.log(`两点之间直线距离是 ${distance} 千米`); }) .catch(error => { console.error('获取距离失败:', error); }); ``` 注意:此代码示例假设你已经在 HTML 文件中添加了名为 "container" 的 div 元素供地图渲染,并且已经设置了 API 密钥。此外,实际项目中可能还需要考虑网络请求的错误处理和性能优化。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

漏刻有时

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值