amis2/docs/zh-CN/components/form/location-picker.md
lghxuelang c07217439e
feat(amis-editor): LocationPicker & Picker组件配置面板升级 (#8936)
* feat(amis-editor): Picker配置面板升级 (#8558)

* feat:(editor)picker面板升级

* merge master

---------

Co-authored-by: liuguihua <liuguihua@baidu.com>

* feat: location-picker-editor 优化

* feat: location-picker-editor 点击函数以及文档处理

* feat: location-picker-editor 取消输入框样式

* feat: location-picker-editor 地图ak支持变量映射 (#8881)

Co-authored-by: jiangchunhui <jiangchunhui@baidu.com>

* feat:(amis-editor)locationPicker & Picker组件配置面板升级

---------

Co-authored-by: liuguihua <liuguihua@baidu.com>
Co-authored-by: jiangchunhui <jiangchunhui@baidu.com>
Co-authored-by: hsm-lv <80095014+hsm-lv@users.noreply.github.com>
Co-authored-by: wutong <34541195+igrowp@users.noreply.github.com>
Co-authored-by: 青辉 <66730036+QingHui1229@users.noreply.github.com>
2023-11-29 11:47:11 +08:00

4.9 KiB
Raw Blame History

title description type group menuName icon order
LocationPicker 地理位置 0 null LocationPicker 30

用于选择地理位置

基本用法

{
  "type": "form",
  "api": "/api/mock2/form/saveForm",
  "debug": true,
  "body": [
    {
      "type": "location-picker",
      "name": "location",
      "ak": "LiZT5dVbGTsPI91tFGcOlSpe5FDehpf7",
      "label": "地址"
    }
  ]
}

注意其中的 ak 参数只能在 amis 官网示例中使用,请前往百度地图开放平台申请自己的 ak

高德地图(暂不支持)

{
  "type": "form",
  "api": "/api/mock2/form/saveForm",
  "debug": true,
  "body": [
    {
      "type": "location-picker",
      "name": "location",
      "vendor": "gaode",
      "ak": "8ae6a7549ce3f37f8e5aab9d445df8ad",
      "label": "地址"
    },
  ]
}

高德地图需要设置 vendorgaode,并且需要设置 ak。其中的 ak 参数为随机值, 请替换为自己申请的 ak 高德地图的 ak 申请地址:高德地图开放平台

请注意: 高德地图不支持坐标转换

属性表

当做选择器表单项使用时,除了支持 普通表单项属性表 中的配置以外,还支持下面一些配置

属性名 类型 默认值 说明
value LocationData 参考 LocationData
vendor 'baidu' | 'gaode' 'baidu' 地图厂商,目前只实现了百度地图和高德地图
ak string 百度/高德地图的 ak
clearable boolean false 输入框是否可清空
placeholder string '请选择位置' 默认提示
autoSelectCurrentLoc boolean false 是否自动选中当前地理位置
onlySelectCurrentLoc boolean false 是否限制只能选中当前地理位置设置为true后可用于充当定位组件
coordinatesType 'bd09' | 'gcj02' 'bd09' 坐标系类型,默认百度坐标,使用高德地图时应设置为'gcj02' 高德地图不支持坐标转换

坐标系说明

  • bd09百度坐标系在 GCJ02 坐标系基础上再次加密。
  • gcj02火星坐标系是由中国国家测绘局制定的地理坐标系统。

LocationData

属性值 类型 是否必填 说明
address string 地址信息
lng number 经度,范围:[-180, 180]
lat number 维度,范围:[-90, 90]
vendor 'baidu' | 'gaode' 地图厂商类型

事件表

当前组件会对外派发以下事件,可以通过onEvent来监听这些事件,并通过actions来配置执行的动作,在actions中可以通过${事件参数名}${event.data.[事件参数名]}来获取事件产生的数据,详细请查看事件动作

事件名称 事件参数 说明
change [name]: LocationData 组件的值 选中值变化时触发

动作表

当前组件对外暴露以下特性动作,其他组件可以通过指定actionType: 动作名称componentId: 该组件id来触发这些动作,动作配置可以通过args: {动作配置项名称: xxx}来配置具体的参数,详细请查看事件动作

动作名称 动作配置 说明
clear - 清空
reset - 将值重置为resetValue,若没有配置resetValue,则清空
setValue value 参考 LocationData