高德地图进阶开发实战案例(1):webAPI坐标转换和jsAPI批量转换

简介: 高德地图进阶开发实战案例(1):webAPI坐标转换和jsAPI批量转换

坐标转换是一类简单的HTTP接口,能够将用户输入的非高德坐标(GPS坐标、mapbar坐标、baidu坐标)转换成高德坐标。

webAPI坐标转换

JS函数封装

    /*
     * coordsys,原坐标系,可选值:gps;mapbar;baidu;autonavi(不进行转换)
     * */
    function convertPoints(points, coordsys, keys) {
        var url = "https://restapi.amap.com/v3/assistant/coordinate/convert?locations=" + points + "&coordsys=" + coordsys + "&output=json&key=" + keys;
        $.getJSON(url, function (res) {
            //console.log(res);
            $("#coords").html(res.locations);
        })
    }
    var points = "121.554586,29.813444";
    var coordsys = "baidu";
    var keys = "4d9a765939a**";
    //函数调用;
    convertPoints(points, coordsys, keys);


成功返回的数据格式

jsAPI批量转换

    var map = new AMap.Map('container', {
        center: [121.548181, 29.806906],
        zoom: 15
    });
    // 创建包含4个节点的折线及文字标注
    var path = [
        new AMap.LngLat(121.552371,29.813682),
        new AMap.LngLat(121.555713,29.812867)
    ];
    // 坐标转换
    /*
    * type用于说明是哪个服务商的坐标,可选值有:
     gps:GPS原始坐标;
     baidu:百度经纬度;
     mapbar:图吧经纬度;*/
    AMap.convertFrom(path, 'baidu', function (status, result) {
        console.log(result);
        if (result.info === 'ok') {
            var path2 = result.locations;
            polyline2 = new AMap.Polyline({
                path: path2,
                borderWeight: 2, // 线条宽度,默认为 1
                strokeColor: 'blue', // 线条颜色
                lineJoin: 'round' // 折线拐点连接处样式
            });
            map.add(polyline2);
        }
    });

成功返回的数据格式

lockdatav Done!


相关文章
|
JavaScript 前端开发 API
python对接API二次开发高级实战案例解析:百度地图Web服务API封装函数(行政区划区域检索、地理编码、国内天气查询、IP定位、坐标转换)
python对接API二次开发高级实战案例解析:百度地图Web服务API封装函数(行政区划区域检索、地理编码、国内天气查询、IP定位、坐标转换)
446 0
|
4月前
|
小程序 定位技术 开发工具
【微信小程序-原生开发+TDesign】通用功能页封装——地点搜索(含腾讯地图开发key 的申请方法)
【微信小程序-原生开发+TDesign】通用功能页封装——地点搜索(含腾讯地图开发key 的申请方法)
56 0
|
6月前
|
小程序 JavaScript Java
基于微信小程序的报刊订阅小程序的设计与实现(源码+lw+部署文档+讲解等)
基于微信小程序的报刊订阅小程序的设计与实现(源码+lw+部署文档+讲解等)
|
6月前
|
存储 JavaScript 小程序
高德地图实现点聚合功能的详细步骤加截取地图图片 (附源码)
高德地图实现点聚合功能的详细步骤加截取地图图片 (附源码)
130 0
|
移动开发 小程序 JavaScript
微信小程序学习实录5(H5嵌入小程序、map组件、地图调起功能、腾讯百度高德导航页、返回web-view页)
微信小程序学习实录5(H5嵌入小程序、map组件、地图调起功能、腾讯百度高德导航页、返回web-view页)
564 0
|
移动开发 JavaScript 前端开发
数据可视化大屏百度地图手机端标注开发实战案例解析(jsAPI接口、标注分类图片、文本标签、分类筛选、自适应高度信息弹窗、PHP后端API)
数据可视化大屏百度地图手机端标注开发实战案例解析(jsAPI接口、标注分类图片、文本标签、分类筛选、自适应高度信息弹窗、PHP后端API)
205 0
|
定位技术 API C#
C# 高德地图WebApi对接示例
1、登录或注册高德地图开放平台然后申请应用key(需要认证个人或企业开发者) 高德开放平台 | 高德地图API (amap.com) 2、创建新应用,为新应用添加key,完成第一项后即可看到key管理 3、具体的开发文档、接口入参出参以及结果示例等详见高德地图开放平台官网 地理/逆地理编码-API文档-开发指南-Web服务 API | 高德地图API (amap.com) 4、直接书写具体示例 开发语言:C# 开发工具:visual studio 2019 开发项目类型:控制台程序 //
191 1
C# 高德地图WebApi对接示例
|
前端开发 定位技术
前端学习笔记202305学习笔记第二十三天-地图概览重构
前端学习笔记202305学习笔记第二十三天-地图概览重构
64 0
|
定位技术 Python
百度地图webAPI:python坐标批量转换
百度地图webAPI:python坐标批量转换
120 0
|
JavaScript 前端开发 定位技术
地图开发实战案例:高德地图loca API 文字LabelsLayer效果
地图开发实战案例:高德地图loca API 文字LabelsLayer效果
263 0
下一篇
无影云桌面