选址组件 最后更新时间: 2024年07月31日
产品介绍
选址组件是可以让用户快速、准确地选择并确认自己的当前位置,并将相关位置信息回传给开发者。
使用场景
使用场景:出行类APP中起始点位置的选择以及O2O类应用中收货地址的选择。
调用方式
1.通过iframe内嵌调用
地图选点组件的页面会根据开发者设置的iframe宽高自适应。如果需要获取用户点击的列表项,需要通过 iframe 形式访问选址组件。
注意:开发者可以在自己的页面里通过iframe内嵌的方式调用该组件的时候,由于存在跨域的问题,需要通过html5 postMessage 的方式回传用户选择的位置信息,开发者需要在自己的页面中实现一个监听函数,例如:
(function(){
var iframe = document.getElementById('test').contentWindow;
document.getElementById('test').onload = function(){
iframe.postMessage('hello','https://m.amap.com/picker/');
};
window.addEventListener("message", function(e){
alert('您选择了:' + e.data.name + ',' + e.data.location)
}, false);
}())
返回结果
{
location:"116.273938,39.998766",
address: "北京市海淀区新建宫门路19号",
name: "颐和园",
}
查看demo
以下demo展示了点击地址后弹出提示框的功能。请扫描二维码,在手机端体验该功能,或点击这里查看。
2.通过URL调用
https://m.amap.com/picker/?keywords=parameter1&zoom=parameter2¢er=parameter3&radius=parameter4&total=parameter5&key=parameter6&jscode=您申请的安全密钥
运行示例
参数名 | 值(点击可编辑) | 参数说明 | 是否必填 |
---|---|---|---|
keywords | 写字楼,小区,学校 | 表示搜索的关键词,支持3个关键词,用英文逗号分隔;(超过3个时取前三个值) 缺省时,默认值:写字楼,小区,学校 | 否 |
zoom | 15 | 地图区域的缩放级别,取值范围是3-18,默认值是15 | 否 |
center | 116.470098,39.992838 | 用于表示待标注点的坐标。格式为(经纬,纬度),小数点后不超过6位。可通过高德坐标拾取工具获得某点的精确经纬度。 center表示用户当前位置: 1)可根据容器获取的定位结果进行传递; 2)参数为空时,默认调用HTML5定位结果,部分手机可能存在定位失败; | 否 |
radius | 1000 | 表示搜索的范围半径,单位为:米。取值范围(1,50000),为空则默认为1000。 | 否 |
total | 20 | 检索结果条数,默认为20,取值范围1-50。 | 否 |
key | (您的Key) | 用户通过开发者控制台获取的Key | 是 |
jscode | (您的安全密钥) | 用户通过开发者控制台获取的安全密钥 | 是 |
返回参数说明
注意:返回参数指访问 URL 时返回的列表项信息,并非用户点击列表项时返回的内容信息。
名称 | 类型 | 说明 |
---|---|---|
location | String | 返回的位置点坐标信息 |
address | String | 返回的POI点地址,通过手动定位获取时该项缺失 |
name | String | POI名称 |